1.脚手架里面为什么main.js 里面，使用了render 函数/**
* 该文件是整个项目的入口文件 */ //引入Vue import Vue from 'vue' // 引入App 组件 他是所有组件的父组件 import App from './App.vue' //关闭vue 的生产提示 Vue.config.productionTip = false // 创建Vue 实例对象--vm new Vue({ // //将 app 组件放入到容器中 render: h => h(App), }).$mount('#app')2. 以前单文件为main.js 里面 写法 /** * 该文件是整个项目的入口文件 */ //引入Vue import Vue from 'vue' // 引入App 组件 他是所有组件的父组件 import App from './App.vue' //关闭vue 的生产提示 Vue.config.productionTip = false // 创建Vue 实例对象--vm
new Vue({ el:'#app', template:`<App>你好呀</App>`, comments:{App} }) 运行后会报错 Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.(found in <Root> 你正在使用运行版本的 vue（残缺的 vue 没有获取到模板解析器） 并且模板解析器没有成功获取到. 解决方法使用 render 函数，，或者使用完整版的 vue。 那是因为在main.js 里面引入了。import Vue from 'vue' 引入第三方库，引入的都是残缺的vue。 /** * 该文件是整个项目的入口文件 */ //引入Vue import Vue from 'vue/dist/vue' // 引入了完整的vue // 引入App 组件 他是所有组件的父组件 //import App from './App.vue' //关闭vue 的生产提示 Vue.config.productionTip = false // 创建Vue 实例对象--vm
new Vue({ el:'#app', template:`<h1>你好呀</h1>`, //comments:{App} }) 可以显示运行，没有问题。 引入残缺版本的vue 怎么解决 /** * 该文件是整个项目的入口文件 */ //引入Vue import Vue from 'vue' // 引入App 组件 他是所有组件的父组件 //import App from './App.vue' //关闭vue 的生产提示 Vue.config.productionTip = false // 创建Vue 实例对象--vm // new Vue({ // //将 app 组件放入到容器中 // render: h => h(App), // }).$mount('#app')
new Vue({ el:'#app', // 第一步 //render(createElement){ //console.log('vue调用render'+createElement); //return createElement('h1','你是谁呀'); //} // 第二步 render 里面没有this,,可以简写为箭头函数 // render:(createElement)=>{ // return createElement('h1','你是谁呀'); // } // 第三步 箭头函数左边只有一个参数，可以把 （）省掉 //render:createElement=>{ //return createElement('h1','你是谁呀'); // } // 第四步 箭头函数只有一个函数题，并且还想return render:createElement=>return createElement('h1','你是谁呀'); 这样就和 render: h => h(App)差步多了。 //comments:{App} })
标签：vue,render,--,App,day36,Vue,组件,import From： https://www.cnblogs.com/satisfysmy/p/17573227.html