组件的代码简单得不能再简单了:
<template>
<view>
<input :value="value" placeholder="请输入" />
</view>
</template>
<script>
export default {
name: 'test-input',
props:['value']
};
</script>
在调用组件中,如果不加过滤方法的情况v-model是正常的:
<template>
<view>
<view class="cu-form-group" v-for="(item,index) in arr" :key="index">
<view class="title">{{item.text}}</view>
<test-input v-model="item.value" />
</view>
</view>
</template>
<script>
export default {
data() {
return {
arr: [{
text: "标题",
value: "100"
}]
}
},
filters: {
numFilter(value) {
return value;//直接返回值都不行
}
}
}
</script>
![](http://img-cdn-tc.dcloud.net.cn/uploads/questions/20210630/8427d265df30d7d02900de2b66b553a4.png)
但如果这一行:
<view class="title">{{item.text}}</view>
加了过滤方法后
<view class="title">{{item.text|numFilter}}</view>
下面的输入框直接就没有获取到value的值了,也就是v-model传参失败
大家有知道怎么回事吗?我都把过滤方法的内容去掉了,直接返回参数都不行。