get started with vue"s extend. There is a doubt: is it not possible to use vue instance data objects in Vue"s extended instance constructor template?
<div id="app">
<sg></sg>
</div>
<script type="text/javascript">
var authorExtend = Vue.extend({
template: "<a :href="url" target="_blank">{{siteName}}-{{msg}}</a>
",
data: function() {
return {
url: "https://segmentfault.com",
siteName: "sg"
}
}
});
new authorExtend().$mount("sg");
var app = new Vue({
el: "-sharpapp",
data: {
msg: "1"
}
});
</script>
console error:
Property or method "msg" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property.
so, the data of Vue instance is not used in the extension. What should I do if I want to use it?