Vue.js 管理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>

我的基因突变：

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

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

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

这是我的商品

---

您可以在输入字段的末尾添加一个按钮，并添加一个单击侦听器，以提交一个带有商户对象有效负载的变异

范例

还有你的变异

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

---

有没有办法只在商家身上变异？无法完全理解你的问题。谢谢。这就是merchant如何变异merchantstate，merchant{state.merchant=merchant}，我的问题是有一种方法我不会为每个字段单独创建一个变异。。。示例merchant.name已更改。。那么不使用merchantName怎么办：{get{return this.merchant.name}，setvalue{this.$store.commit'merchantName'，value；}}，问题是我需要每个merchant.name，merchant.merchant\u id等等都这样做……好的，明白了。。。。由于您正在为每个v模型使用计算setter，因此在更新状态中的商户对象时无法提交。。。您可以添加一个按钮，并将click listener设置为提交一个以merchanr obj作为其有效负载的变体的按钮。如何做到这一点？只是一个样本。。。谢谢

<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
    },