there are a large number of extend methods in the element-ui source code, but I have no choice but to ask the community for help
to join three files message.vue message.js main.js
message.vue//
<template>
<div> {{msg}} </div>
</template>
export default {
name: "message",
data() {
return {
show: true,
msg: "hello",
}
}
}index.js//
import Vue from "vue"
import message from "./message.vue"
const message = Vue.extend()
const instance = new message();
instance.vm = instance.$mount();
instance.name = "pick"
instance.msg = "extends message"
export default instance
main.js//
import Vue from "vue"
import message from "./xxxx/index.js"
Vue.component(message.name, message)console error template or render function not defined. I modified index.js according to the error message and still reported an error. I tried whether to pass in the render function el:"-sharpapp" template template or to report an error. I also tried to mount the mount method
const message = Vue.extend({
render: function(createElement) {
return createElement("h1", this.blogTitle)
}
})question: 1 whether it has something to do with the selection of only runtime during scaffolding installation
question: what is the use of name in 2 message.vue? except for writing recursive components if there is no index.js, the file shows that it is useless to declare the name value direct Vue.component (message.name,message). The console output message.name is undifined, and the name value is clearly specified in the message.vue file
.question: 3 I know that the Vue.extend method is automatically called when Vue.component registers components. Extend is just an extend subclass constructor. I have tried to delete index.js and introduce message.vue files directly into main.js. It is no problem at all in Vue.component ("apple",message). Why is it difficult for me to add index.js?