最近小弟在做动态添加SKU的属性的时候。遇到点问题。不知道该怎么通过数组的方式来实现动态添加。所以麻烦各位大佬指点下。感激不尽

解决方案 »

  1.   

    小弟前端用的element组件。所以希望通过数组的方式能够实现动态的添加。并且能够进行双向绑定
      

  2.   


    <body>
      <button @click="add()"></button>
      <table>
        <tbody>
          <tr v-for="sku in skus">
            <td>{{ sku.name }}</td>
            <td>{{ sku.price }}</td>
            <td><button @click="remove(sku)"></button></td>
          </tr>
        </tbody>
      </table><script type="text/javascript">
      new Vue({
        data: {
          skus: [],
          cloneSku: {
            name: '',
            price: ''
          }
        },
        methods: {
          add() {
            var sku = JSON.parse(JSON.stringify( this. cloneSku ))
            this.skus.push( sku )
          },
          remove( sku ) {
            this.skus.splice( this.skus.indexOf( sku ), 1 )
          }
        }
      })</script>
    </body>