前端环境的准备
编码工具:VSCode
https:code。visualstudio。com
依赖管理:NPM
项目构建:VueCliVue框架介绍
学习Vue前端框架需要有html,css,js的基础。
关于MVVM模式:
Vue快速入门
下面开始设计:
新建一个文件夹D:codedemo,打开VisualStudioCode,将demo文件夹拖拽到VisualStudioCode中。
新建一个文件,保存到D:codedemo文件夹中,文件名为demo。html
输入英文的!,然后回车,就可以得到html主要代码
在编写如下代码:body{{message}}body
说明:
1。添加如下代码,导入Vue脚本
2。设置视图(View)。标签之间的内容归View管理,声明要被vue所控制的DOM区域{{message}}
3创建ViewModel(创建vue的实例对象),
data里面规定的是数据,现在把数据渲染到上面的主键里面去,使用{{message}},里面的message就是data里面的属性值。还要通过。mount(app)确定渲染的范围,这里就是这个标签范围内。
这里安装一个插件,openinbrowser。
安装插件有就可以在代码中右键,直接在浏览器中看效果。
可以得到如下效果
进入Vue官网:https:cn。vuejs。org在快手上手里面有基本用法。
1。基本用法!DOCTYPEhtmlhtmllangenheadmetacharsetUTF8metahttpequivXUACompatiblecontentIEedgemetanameviewportcontentwidthdevicewidth,init...
(全文)