成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

翻譯 Meteor React 制作 Todos - 05 - 更新刪除

wenshi11019 / 2361人閱讀

摘要：現(xiàn)在，我們來(lái)學(xué)習(xí)如何進(jìn)行更新和刪除操作。添加內(nèi)容開(kāi)始添加內(nèi)容結(jié)束更新在上面的代碼中，我們?cè)诖_認(rèn)屬性被改變的時(shí)候調(diào)用了方法。刪除在上面的代碼中使用了來(lái)刪除任務(wù)。這個(gè)函數(shù)需要一個(gè)參數(shù)，一個(gè)確定集合中那個(gè)子項(xiàng)應(yīng)該被被刪除的身份證號(hào)碼。

確認(rèn)完成和刪除任務(wù)

到現(xiàn)在為止，我們只有一個(gè)和集合互動(dòng)的方法 -- 在文檔中進(jìn)行插入操作。
現(xiàn)在，我們來(lái)學(xué)習(xí)如何進(jìn)行更新和刪除操作。

先來(lái)給task組件添加兩個(gè)元素： 一個(gè)確認(rèn)選框和一個(gè)刪除按鈕，并給他們帶上各自的事件監(jiān)聽(tīng)

在Task.jsx中寫(xiě)入下面的內(nèi)容

// Task component - represents a single todo item
Task = React.createClass({
  propTypes: {
    task: React.PropTypes.object.isRequired
  },

    // 添加內(nèi)容開(kāi)始
  toggleChecked() {
    // 當(dāng)按下按鈕時(shí)，設(shè)定確認(rèn)值為當(dāng)前的相反值
    Tasks.update(this.props.task._id, {
      $set: {checked: ! this.props.task.checked}
    });
  },
 
  deleteThisTask() {
    Tasks.remove(this.props.task._id);
  },
  // 添加內(nèi)容結(jié)束
 
  render() {
      // 添加下面一行的內(nèi)容
    // 當(dāng)任務(wù)被完成的時(shí)候給它們一個(gè)不同的class
    // 這樣，通過(guò)CSS中的設(shè)置后，它們會(huì)看起來(lái)更好一些。
    const taskClassName = this.props.task.checked ? "checked" : "";
 
    return (

        // 添加內(nèi)容開(kāi)始
      
  • 
        
 
        
 
        {this.props.task.text}
      
    • 
      //添加內(nèi)容結(jié)束

    );
  }
});
    更新

    在上面的代碼中，我們?cè)诖_認(rèn)屬性被改變的時(shí)候調(diào)用了Tasks.update方法。

    這個(gè)在集合中的update函數(shù)需要兩個(gè)參數(shù)，第一個(gè)參數(shù)是一個(gè)選擇器，一個(gè)集合中子集的身份證，第二個(gè)參數(shù)是指定更新數(shù)據(jù)，在匹配到的子集里要干點(diǎn)兒什么

    在這個(gè)部分，選擇器就是本任務(wù)的_id，更新數(shù)據(jù)的參數(shù)就是使用$set去切換checked的值，它代表著此任務(wù)是否被完成了。

    刪除

    在上面的代碼中使用了Tasks.remove來(lái)刪除任務(wù)。這個(gè)remove函數(shù)需要一個(gè)參數(shù)，一個(gè)確定集合中那個(gè)子項(xiàng)應(yīng)該被被刪除的身份證號(hào)碼。

    文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

    轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/91527.html

    相關(guān)文章

    • 翻譯 Meteor React 制作 Todos - 11 - 發(fā)布訂閱

      摘要：通過(guò)發(fā)布訂閱模式過(guò)濾數(shù)據(jù)現(xiàn)在我們已經(jīng)把應(yīng)用中比較敏感的代碼放到了一些方法里面，我們還需要學(xué)習(xí)安全故事的另一半內(nèi)容了。當(dāng)在客戶端被調(diào)用時(shí)傳入發(fā)布器名稱，客戶端將會(huì)從發(fā)布器訂閱所有的數(shù)據(jù)。這個(gè)按鈕應(yīng)該只是給任務(wù)的所有者來(lái)顯示。 通過(guò)發(fā)布訂閱模式過(guò)濾數(shù)據(jù) 現(xiàn)在我們已經(jīng)把應(yīng)用中比較敏感的代碼放到了一些方法里面，我們還需要學(xué)習(xí)Meteor安全故事的另一半內(nèi)容了。到現(xiàn)在為止，我們一直是假設(shè)整個(gè)整個(gè)...

      用戶83 評(píng)論0 收藏0

    • 翻譯 Meteor React 制作 Todos - 06 - 部署應(yīng)用

      摘要：添加，刪除，確認(rèn)完成這些操作，你將會(huì)看到你的應(yīng)用的界面響應(yīng)非常的快。。這是因?yàn)椴⒉粫?huì)在更新用戶界面之前等著服務(wù)端的響應(yīng)數(shù)據(jù)。 部署你的應(yīng)用 現(xiàn)在你有了一個(gè)可以運(yùn)行的待辦事宜的應(yīng)用，你可以分享給你的朋友們！Meteor使得發(fā)布你的應(yīng)用到其他人可以使用的互聯(lián)網(wǎng)變得非常的簡(jiǎn)單。 同樣是在你的應(yīng)用文件夾的命令行中輸入： meteor deploy my_app_name.meteor.com ...

      xiaochao 評(píng)論0 收藏0

    • 翻譯 Meteor React 制作 Todos - 01 - 創(chuàng)建應(yīng)用

      摘要：閑扯在翻譯之前我還是要簡(jiǎn)要介紹一下，這是一款跨時(shí)代的框架。后來(lái)開(kāi)始使用動(dòng)態(tài)的腳本語(yǔ)言，比如后來(lái)以此構(gòu)成了框架。最為出名的自然是。通過(guò)來(lái)傳遞數(shù)據(jù)，在本地起這種事情使得開(kāi)發(fā)進(jìn)入了新的階段。如果你覺(jué)得我翻譯的很爛，來(lái)給我說(shuō)吧郵件地址 閑扯 在翻譯之前我還是要簡(jiǎn)要介紹一下Meteor，這是一款跨時(shí)代的框架。真的，完全沒(méi)有騙你。 一開(kāi)始的網(wǎng)站是純靜態(tài)頁(yè)面搭建的。 后來(lái)開(kāi)始使用動(dòng)態(tài)的腳本語(yǔ)言，比如...

      VishKozus 評(píng)論0 收藏0

    • 翻譯 Meteor React 制作 Todos - 03 - 集合

      摘要：數(shù)據(jù)存儲(chǔ)集合是存儲(chǔ)持久化數(shù)據(jù)的方式。中的集合比較特殊的是，它可以從服務(wù)端，包括客戶端接收數(shù)據(jù)。它也可以自動(dòng)的自我更新，因此一個(gè)視圖組件受到一個(gè)集合的支持，他可以自動(dòng)的展示最新的數(shù)據(jù)。 數(shù)據(jù)存儲(chǔ) 集合(Collection)是Meteor存儲(chǔ)持久化數(shù)據(jù)的方式。Meteor 中的集合比較特殊的是，它可以從服務(wù)端，包括客戶端接收數(shù)據(jù)。這使得編寫(xiě)視圖邏輯變得更加簡(jiǎn)單 -- 不用去寫(xiě)太多的服務(wù)端...

      Scott 評(píng)論0 收藏0

    • 翻譯 Meteor React 制作 Todos - 02 - 組件

      摘要：用定義視圖組件在中，視圖組件是被使用定義的。你的組件可以有任何你想要的方法。組件可以接收來(lái)自于父組件通過(guò)屬性傳過(guò)來(lái)的數(shù)據(jù)。因?yàn)楸窘坛虒Ｗ⒂诤?，所以你可以拷貝下面的代碼到文件中。嘿嘿，來(lái)添加上吧只要把改名成就好了 在 React 組件中定義視圖 在開(kāi)始編寫(xiě)React視圖庫(kù)之前，要先添加react包，這個(gè)包囊括了你在Meteor應(yīng)用中開(kāi)始運(yùn)行React所需要所有東西。這個(gè)React庫(kù)自己可...

      wuyangnju 評(píng)論0 收藏0

    發(fā)表評(píng)論

    0條評(píng)論

    最新活動(dòng)
    閱讀需要支付1元查看
    <