浅入Vue

104 阅读1分钟

在Vue的文档中可以看到,Vue有着不同的版本。

  • 完整版vue.js:同时包含编译器和运行时的版本。(编译器是用来将模板字符串编译成为JavaScript渲染函数的代码。)
  • 运行时vue.runtime.js:用来创建 Vue 实例、渲染并处理虚拟 DOM 等的代码。基本上就是除去编译器的其它一切。(由于没有编译器比完整版的体积少大约30%,优先使用运行时版本image.png
template
new Vue({
    template:`<h1>这是一段文字</h1>`//这里可以直接写HTML,但是需要引入完整版
})
render
new Vue({
    render(h){
        return h('h1',this.title);//,使用DOM操作,不需要引入完整版
    }
})
如何用 codesandbox.io 写 Vue 代码

点击这里跳转到codesandbox.io
由于网站服务器在国外,访问会一点慢,建议科学上网.
打开后点击Vue图标就可以直接写代码了,不需要配置任何东西. image.png

打开默认为最新版的Vue3,可以在左侧Dependencies调整

image.png