2018年7月19日 星期四

【Vue】vue的方法限制(不能直接修改資料)/ Vue.set的用法 (對象,哪個資料,{變成什麼})


vue的方法限制

  • 不能直接修改Vue Data的length
  • 不能直接修改Vue Data資料
  <h1>刪除</h1>
        <button @click="setData">送出</button>
        <li v-for="(item, key) in member" :key="item.age">
            {{ key }} - {{ item.name }} {{ item.age }} 歲
        </li>
 methods:{
   setData: function () {
                var vm = this;
                vm.member.length = 0; //不能直接改資料長度,這種寫法不會成功

                vm.member[0] = {   //不能直接改資料,這種寫法不會成功
                     name: "奇怪",
                     age: "30"
                 }
}

Vue.set

  • 要改資料必須要用set
  • Vue.set(對象,哪個資料,{變成什麼})
methods:{ 
   setData: function () {

                Vue.set(vm.member, 1, {
                    name: "奇怪",
                    age: "30"
                })
            }
}

沒有留言:

張貼留言

【JavaScript】用物件Mapping的方法

If的寫法 我們希望當變數是a時就回傳1,變數是b就回傳2,變數是c就會回傳3,一般寫法就是用if,但是這樣會很冗 ​ // IF style var word if(word == 'a'){ word = 1 } else if...