关于$emit和子组件父组件问题
粉丝福利 : 关注VUE中文社区公众号,回复视频领取粉丝福利
<currency-input v-model="price"></currency-input>
Vue.component('currency-input', {
template: '\
<span>\
$\
<input\
ref="input"\
v-bind:value="value"\
v-on:input="updateValue($event.target.value)"\
>\
</span>\
',
props: ['value'],
methods: {
// 不是直接更新值,而是使用此方法来对输入值进行格式化和位数限制
updateValue: function (value) {
var formattedValue = value
// 删除两侧的空格符
.trim()
// 保留 2 小数位
.slice(
0,
value.indexOf('.') === -1
? value.length
: value.indexOf('.') + 3
)
// 如果值不统一,手动覆盖以保持一致
if (formattedValue !== value) {
this.$refs.input.value = formattedValue
}
// 通过 input 事件发出数值
this.$emit('input', Number(formattedValue))
}
}
})
我的问题是最后一句代码$emit是什么意思完全不懂,他激活了input事件,然后重复操作了 updateValue方法吗?他这个值传给父组件,父组件怎么接受呢,怎么表达出来呢?还有input绑定了:value=“value”,引号的value代表了什么呢