微小店网站建设费用,淮北矿业工程建设公司网站,商城网站建设报价表,wordpress网站下方目录 一、脚手架中不能使用template配置二、基本使用三、关于不同版本的Vue 一、脚手架中不能使用template配置 // 引入vue
import Vue from vue
import App from ./Appnew Vue({el:#app,template:h1hhh/h1,comments:{App},})上面案例中#xff0c;配置了temp… 目录 一、脚手架中不能使用template配置二、基本使用三、关于不同版本的Vue 一、脚手架中不能使用template配置 // 引入vue
import Vue from vue
import App from ./Appnew Vue({el:#app,template:h1hhh/h1,comments:{App},})上面案例中配置了template属性就会报错如下图所示
从上图的错误中我们知道处理方式有两种
一种使用带有模板编译器的vue第二种使用render
因为Vue默认引用的是dist/vue.runtime.esm.js 二、基本使用 render函数里没有用到this所以可以简写为箭头函数只有一个参数可以省略小括号函数体中只有一个返回值语句可以省略花括号{}。因此
render(createElement){return createElement(h1,hhh)}可以简写为
render: createElement createElement(h1,hhh)案例如下
// 引入vue
import Vue from vue
import App from ./Appnew Vue({el:#app,// template:h1hhh/h1,comments:{App},// 将App组件放入容器中render: h h(App),
})三、关于不同版本的Vue vue.js 与vue.runtime.xxx.js的区别: (1). vue.is是完整版的Vue包含核心功能模板解析 (2). vue.runtime.xxx.js是运行版的Vue只包含:核心功能没有模板解析器。因为vue.runtime.xxx.js没有模板解析器所以不能使用template配置项需要使用render函数接收到的createElement函数去指定具体内容。