管理突变Vuejs

这是管理突变的正确方法吗？管理突变Vuejs

我的HTML

<div class="form-group"> 
         <label>Merchant Id No:</label> 
         <input type="text" class="form-control border-input" v-model="merchantId"> 
        </div> 
        <div class="form-group"> 
         <label>Name:</label> 
         <input type="text" class="form-control border-input" v-model="merchantName"> 
        </div>

我的计算属性：

merchantId: { 
      get(){ 

       return this.merchant.merchant_id 
      }, 
      set(value){ 

      this.$store.commit('merchantId', value); 
      } 
     }, 
     merchantName: { 
      get(){ 

      return this.merchant.name 
      }, 
      set(value){ 
      this.$store.commit('merchantName', value); 
      } 
     },

我的突变：

merchantName(state, merchantName){ 
      state.merchant.name = merchantName 
     }, 
     merchantId(state, merchantId){ 
      state.merchant.merchant_id = merchantId 
     },

有没有办法只在商家变异？因为我需要一个接一个地做。

merchant(state, merchant){ 
     state.merchant = merchant 
    },

这是我的商人对象。

来源

2017-06-23 Rbex

'有没有办法只在商家变异？'，无法理解你的问题完全。 –

谢谢。这就是商人如何改变商人（州，商家）{state.merchant = merchant }，'我的问题是有没有办法为每个领域单独创建一个突变......例如'merchant.name'是改变了..我又如何能不使用'MERCHANTNAME做到这一点：{ 的get（）{ 回报this.merchant.name }，集（值）{ 此$ store.commit（ 'MERCHANTNAME'，值）; } }，' – Rbex

问题是我需要每一个'merchant.name'，'merchant.merchant_id'等等...... – Rbex

您可以在输入字段的末尾添加一个按钮，添加一个点击监听器提交的突变枝条商人对象的有效载荷。

例

<div class="form-group"> 
    <label>Merchant Id No:</label> 
    <input type="text" class="form-control border-input" v-model="merchant.merchantId"> 
</div> 
<div class="form-group"> 
    <label>Name:</label> 
    <input type="text" class="form-control border-input" v-model="merchant.merchantName"> 
</div> 
<div class="form-group"> 
    <label>Name:</label> 
    <input type="email" class="form-control border-input" v-model="merchant.merchantEmail"> 
</div> 

// more input fields... 

<button @click.prevent="save">Save merchant<button>

脚本

export default{ 
    data(){ 
     return{ 
      merchant:{ 
       merchantId:'', 
       merchantName:'', 
       merchantEmail:'' 
       //more properties binded to the v-model 
      } 
     } 
    }, 
    methods:{ 
     click(){ 
      this.$store.commit('merchant', this.merchant); 
     } 
    } 
}

和你突变

merchant(state, merchant){ 
     state.merchant = merchant 
    },

来源

2017-06-23 09:30:42

管理突变Vuejs

回答

相关问题