拉果后台管理系统前端开发

前端开发

Vue公司

自下而上

从下到上一层一层的app：渐进式框架实现有助于增量项目开发

Vue实例

El：定义vue挂载的元素节点，表示vue接管该区域

数据：vue中使用的数据，通过｛｛name｝｝插值表达式获得

Vue指令

//V-text获取数据并覆盖以前的内容

<；/h2>

//拼接

<；/h2>

//V-on：单击@click等效，@dblclick双击事件

//V-bind集属性

//v形，用于

｛｛索引｝｝，｝｛项｝

在方法中使用此关键字获取数据数据

V-html设置元素的innerHTML并解析数据的html标记

V-show修改显示属性以显示和隐藏，而true显示

V-if操作dom实现显示和隐藏

多变量虚拟机

模型：存储数据

视图：页面显示

ViewModel：业务处理，对应于创建的vue实例vm

公理

Var that=this//这保存在回调函数中

插值表达式页面闪烁

[v形斗篷]{

显示：无；

}

Vue组件

全局组件，模板只能有一个根元素

本地组件

Vue生命周期

beforeCreate（）组件实例化未完成

Created（），组件实例化完成，未生成DOM页面

beforeMoun（）模板已在内存中编辑，可以获取数据数据。尚未将其呈现到页面，并且尚未呈现插值表达式

Mounte（），模板已完成渲染，执行后显示页面

beforeUpdate（）内存中的数据已更新，尚未呈现到页面。

update（）内存中的数据已更新，执行后将显示页面。

Vue路线

定义布线组件

定义管线。路线就是路线

路由管理实例路由器

创建vue实例，路由器注入vue实例

添加超链接<；/路由器链接><；路由器视图><；/router视图>路线匹配后，要渲染的位置

路线=[

｛path:“/home”，组件：home｝，

]

const router=新VueRouter（｛routes:路由｝）

新Vue（｛路由器｝）。$Mount（“#app”）//相当于el:“#app“

vue-cli自定义配置文件

/vue.config.js/

单元exports=｛devServer:｛open:true端口：8889｝｝

项目运营流程

加载main js，渲染：h=>h（App）打包条目文件以运行

app。vue项目的主要组成部分，页面输入文件

路由配置

组件参数传输

道具：｛msg:String｝`

道具：['msg']

页面跳转

这个.$路由器。推送（）

this.$router.back（）

//获取路由参数

this.$route.params

跨域问题

无访问控制允许源

协议、域名和端口的任何差异都是跨域的

树控件

默认属性：{

儿童：“儿童”，

label:“标签”

}

//自定义

<…slot scopte=“｛node，data｝”>

｛｛data.label｝｝

｛｛node.level｝｝

//对象副本

Object.assign（目标，源）

//v模型中的数据应为字符串类型，并且应转换int类型

v-for=“选项中的项目”

：key=“item.value”

：label=“item.label”

：value=“item.value”>

事件冒泡

单击子元素事件，父元素的相同事件也将被触发。

@单击。停止解决事件气泡，父元素将不会接收事件