在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML/ vue中傳值問(wèn)題

vue中傳值問(wèn)題

<body>

    <div id="app">
        <p>總數(shù)：{{total}}</p>
        
            <my-component v-model="total">
                 </my-component>
            <button @click="handleGetTotal"></button>
    
    </div>
</body>
    <script src="https://unpkg.com/vue/dist/vue.min.js"></script>
<script>

    Vue.component('my-component',{
        prors:['value'],
        template:'<input :value="value" @input="handleIncrease"/>',
    
      methods:{
          handleIncrease:function(event){
              
              this.$emit('input',event.target.value);
          },

      }
        
    });
    var app=new Vue({
        el:'#app',
        data:{
            total:0
        },
        methods:{
            handleGetTotal:function(){
                this.total--;
            }
        }
        
    })
</script>

中間template:'<input :value="value" @input="handleIncrease"/>',這句話什么意思，這個(gè)value怎么來(lái)的，瀏覽器報(bào)錯(cuò)也說(shuō)value未定義

回答
編輯回答
負(fù)我心

<input :value="value" @input="handleIncrease"/>

:value 意思是 把props里的value綁定 其實(shí)跟我們平時(shí)的

<input v-model="value" @input="handleIncrease"/>一樣

至于@input="handleIncrease" 是當(dāng)input的值發(fā)生改變時(shí)，handleIncrease里的this.$emit('input')是改變props的值，使得有雙向綁定的效果

2017年10月7日 21:42
編輯回答
我甘愿

clipboard.png
我猜你這里是想寫一個(gè)props

2017年7月14日 08:46
編輯回答
吃藕丑

v-model只是語(yǔ)法糖，會(huì)默認(rèn)吧value作為屬性傳入組件內(nèi)部，然后通過(guò)input的事件拋出value值，達(dá)到雙向綁定；

2017年7月22日 00:35
編輯回答
替身

你在data(){return{}}里面定義了value了嗎

2018年5月22日 18:15