vue.js文本框随v模型消失关键字

Question

有一天vue.js程序员在这里。没有Javascript的经验。第一次在这个论坛上提问。

修改别人的代码。每当我添加v-model关键字时，控件都将停止显示。

Javscript

var layoutHeader = Vue.extend({ 
    template: '#layout-header-tpl', 
    props: ['userinfo'] 
}); 

的Html

1. 这个工作，显示文本框（没有V型关键字）

<template id="layout-header-tpl"> 
 
    <input type="text" class="form-control" placeholder="Search"> 
 
    </template>

2）此不起作用，文本框disappeares（加入V-模型关键字）

<template id="layout-header-tpl"> 
 
    <input type="text" class="form-control" placeholder="Search" v-model="something1234"> 
 
</template>

3）此不起作用，文本框disappeares（从模板删除ID）

<template> 
 
    <input type="text" class="form-control" placeholder="Search" v-model="something1234"> 
 
</template>

4）这个工程，显示文本框（注释掉模板）

<!--<template>--> 
 
    <input type="text" class="form-control" placeholder="Search" v-model="something1234"> 
 
<!--</template>-->

任何想法是怎么回事？

Answer 1

你提到你正试图重用/修改别人的代码。我相信你试图通过使用Vue.extend来做某种“继承”。

如果是这样，请注意继承是不建议。有关详细信息，请参阅讨论主题的链接：https://github.com/vuejs/Discussion/issues/354

这个讨论是围绕Vue 1.0版本进行的，但我认为它仍然与Vue 2.0相关。

正如该页面所述，如果您在团队中工作并共享代码/组件，则可以使用mixins代替。您可以在文档中找到更多详细信息：http://vuejs.org/guide/mixins.html