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

鍍金池/ 問答/HTML/ 怎么用vue.js做組件循環(huán)遍歷

怎么用vue.js做組件循環(huán)遍歷

在其中一個輸入框里面輸入內(nèi)容,三個輸入框就會都輸入進去,并且相同,但是想要的是每個輸入框輸入的內(nèi)容都可以唯一。就是希望實現(xiàn)這種(3個計數(shù)器,互相獨立。每個計數(shù)器有加減按鈕。并且有一個總的計數(shù)按鈕,點擊得到三個計數(shù)器的和)

問題出現(xiàn)的環(huán)境背景及自己嘗試過哪些方法

<ul id="vfor">
    <li v-for="(item,index) in 3">
        <input type="number" v-model="message" min="1">
        <select v-model="ope" >
            <option value="0">+</option>
            <option value="1">-</option>
            <option value="2">*</option>
            <option value="3">/</option>
        </select>
        <input type="number" v-model="message1" min="1">
        <input type="button" @click="res(index)" value="=">
        <span>{{message2}}-{{index}}</span>
    </li>
</ul>

new Vue({

        el:"#vfor",
        data:{
                ope:"0",
                message:"0",
                message1:"0",
                message2:"0",
            },               
            methods:{
            res:function(index){
                if(this.ope=='0'){
                    this.message2=(this.message-0)+(this.message1-0)
                }
                    if(this.ope=='1'){
                    this.message2=(this.message-this.message1)
                }
                    if(this.ope=='2'){
                    this.message2=(this.message*this.message1)
                }
                    if(this.ope=='3'){
                    this.message2=(this.message/this.message1)
                }
        
            },
            }
})

</script>

回答
編輯回答