vue笔记

最新推荐文章于 2024-01-26 16:05:33 发布

原创最新推荐文章于 2024-01-26 16:05:33 发布 · 317 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js

前端专栏收录该内容

6 篇文章

订阅专栏

插值表达式{{}}
data:
function:

v-show和v-if的区别：v-show 添加display的样式 v-if删除dom元素
v-if v-for v-bind : v-on @
在组件方式中使用function { return} 返回数据
组件template有且必须只有一个根元素
全局注册组件 Vue.component{}
本地注册组件在new vue对象时的component属性

组件中使用data:function(){ return data} 获取数据在es6中可以直接使用data(){return {data}}代替
从父组件中获取数据子组件中的属性：props

webpack就是脚手架工具

在vue-router单页面应用中，页面的路径改变就是组件的切换
router-link是路由的超链接，点击router-link会跳转到指定路由，to属性表示要跳转的路径；
router-link是路由的导航，最终会被渲染成标签

router-view该标签会根据当前的路径，动态的渲染不同的组件替换到router-view的位置
router-view标签用于显示对应路由的内容
步骤：
安装vue-router
导入vue-router
创建组件
设置组件和路由的映射关系
使用router-link和router-view来使用路由

import路径：配置webpack打包时将“@”解析为项目的src目录

ElementUI是和layUi一样的前端样式框架
Elenent文档地址：https://element.eleme.cn/#/zh-CN/component/quickstart
axios是异步请求工具
vuex将多个组件共享的变量全部存储在一个对象里面，然后将这个对象放到顶层的Vue实例中，让其他组件可以使用
注意：vue 的 2.x 版本对应 vuex 的 3.x 版本，vue 的 3.x 版本对应 vuex 的 4.x 版本