使用環境
使用軟鍵盤時,鍵盤爲組件,輸入框是父組件…鍵盤的輸入值要傳到父組件輸入框上
(.sync加了纔可以使用this.$emit)
(this.$emit(‘update:參數名’,值))
例子
test.vue
<template>
<view>
<view style="background: #fff;padding:20upx;margin-top:20upx" class="pay_t">
<view class='pay_t_t'>請輸入付款金額</view>
<view style="display: flex;align-items: center;font-size: 80upx;font-weight: bold;height: 140upx;border-bottom: 1px solid #C0BFC4;" class='pay_t_m'><text style="margin-left: 20upx;">¥</text>
{{money}}</view>
</view>
<testcount :money.sync="money"></testcount>
</view>
</template>
<script>
import testcount from "@/components/testcount.vue"
export default {
name:"test",
components:{
testcount
},
data() {
return {
money:'',
};
},
}
</script>
<style lang="less">
.pay_t{
view{
padding:10upx;
}
}
</style>
testcount.vue(軟鍵盤組件,自己封裝,可以改動)
<template>
<div>
<button @click="add"> add</button>
</div>
</template>
<script>
export default{
name:"testcount",
data(){
return {
money:'',
}
},
methods:{
add(){
this.money+=1;
}
},
watch:{
money(val){
console.log("改變",val);
this.$emit('update:money',val); //主要
}
},
}
</script>
<style>
</style>