Vue 两个版本的区别和使用方法

284 阅读1分钟

Vue两个版本对应的文件名

在介绍两个版本名称之前,首先应该解决一个问题,那就是如何使用Vue实例

方法一:从HTML得到视图

这种方法就是两个版本中的其中一个完整版Vue,从CDN应用vue.js或vue.min.js

方法二:用JS构建视图

这种方法使用的是vue.runtime.js,方法一和方法二可以看一下vue文档

方法三:使用Vue-loader

可以把.vue文件翻译成h构建方法,但这样做HTML就只有一个div#app,SEO不友好

  • 在介绍区别之前,先来了解templaterender

template 和 render

  • templete是视图的内容,可以直接包含html内容,常直接放在视图层,用在完整版就直接把html显示在视图
template: ` {{n}}`
  • render是非完整版常用的,常把视图写在rander函数中,用h来创造标签,templete的内容放在vue文件中,vue-loader可以把内容被转换成render(h){h(‘div’)},render函数为render:h=>h(demo)

完整版和非完整版区别

扩展:还可以在codesandbox上写vue代码