如何在自定义组件上启用 v-model？

Posted 2023-04-13

【中文标题】如何在自定义组件上启用 v-model？

【英文标题】：How to enable v-model on custom component?

【发布时间】：2019-06-14 05:18:36

【问题描述】：

我正在尝试将 TexField ui 包装到一个新的自定义组件中，以便我可以添加额外的功能并在项目中重用该组件。我希望它仍然具有 v-model 绑定，所以我实现了以下内容：

:text="text" 

和

@textChange="(update)=>$emit('textChange', update.value)"

其中“text”是它的 prop 命名并完全像普通的 TextField prop 一样暴露。

该模式应该可以在 web 上使用，但我不知道它是否可以在 nativescript vue 组件上使用。请看一下我在操场上写的代码：https://play.nativescript.org/?template=play-vue&id=Ikap1R&v=1

它不工作。如果您知道解决方案，请提供帮助。

谢谢

【参考方案1】：

您无需专门为 N 做任何事情，如果您知道它是如何与 Vue.js 一起工作的，那么您就明白了。

您所要做的就是使用 value 属性作为输入值并在更改时发出 input 事件。

Updated Playground