Typescript上的Vue组件未绑定2种方式
Typescript上的Vue组件未绑定2种方式
提问于 2018-01-30 19:11:11
我将vue组件定义为Typescript类，如下所示：
import {Component} from 'vue-property-decorator'
import Vue from "vue";
@Component({})
export default class TestComponent extends Vue {
test:string;
}并从我的入口文件中调用它，如下所示：
let test = new TestComponent({el:'#element'});将其附加到以下HTML：
<section id="element">
<h2>test is <span>{{test}}</span></h2>
<form>
<input type="text" name="test" v-model="test">
</form>
</section>组件被正确初始化并显示我的测试消息，但是' test‘变量没有被绑定-当我更新输入字段时，值没有改变，当我在Vue devtools上检查它时，我看不到任何数据绑定。
有什么建议吗？
谢谢，Y。
回答 1
Stack Overflow用户
发布于 2018-12-19 04:58:02
检查您的控制台日志:它是否包含:属性或方法"test“未在实例上定义，但在呈现过程中被引用。通过初始化此属性，确保此属性是反应性的，无论是在data选项中，还是对于基于类的组件。请参阅：
解决方案，请参阅：https://codesandbox.io/s/vnlo3rq283
但简而言之:初始化您的变量
test: string = "";页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/48519977
复制相关文章
相似问题