当前阅读教程:Vue.JS入门教程 > 使用Notepad(记事本)建立第一个Vue.js页面 | |
阅读(22555525) 收藏 赞(5685) 分享 | |
上一篇: 编辑器类型 | 下一篇: 使用Dreamweaver建立第一个Vue.js页面 |
我们这里演示的是Windows7系统。 n 第1步:找到电脑左下角,点击开始图标,如下图。 n 第2步:点击所有程序,找到附件,如下图 n 第3步:点击附件,找到记事本,如下图。 n 第4步:打开记事本后,复制我们下面第一个Vue.je代码的内容到记事本 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Vue入门第一个vue页面</title> <!--引用互联网中vue.js的代码,后面会讲解如何引用本地vue.js的代码--> <script src="https://unpkg.com/vue/dist/vue.js"></script> </head> <body> <!--显示代码--> <div id="app"> <!--显示变量message的内容,也就是显示”Hello Vue.js!“--> <p>{{ message }}</p> </div> <!--脚本代码--> <script> new Vue({ el: '#app', data: { message: 'Hello Vue.js!' } }) </script> </body> </html> n 第5步:点击文件,然后点击保存(或者按快捷键Ctrl+S)“第一个Vue页面.html”;按内容填写即可。 n 第6步:点击我们刚才保存的“第一个vue页面.html”,电脑会用默认浏览器打开,如下。 附:我们也可以选中该文件,右键,打开方式,选择其他浏览器(我们这里选择谷歌浏览器) 效果如下图 |
|
上一篇: 编辑器类型 | 下一篇: 使用Dreamweaver建立第一个Vue.js页面 |