![](https://img-blog.csdnimg.cn/20200114084544504.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
Vue
Vue学习记录,Vuex、VueRouter,关于Vue的记录
qq_36913208
吉他硫酸圣手、撸猫淫贼,现在是前端狗一条
展开
-
Vue 学习记录,从难受到真香
前言Vue 这个东西很强,听说不会js的学完后也能用得飞起?就是有点无脑,本文主要意图是记录自己学习中的流程和各种疑点,总之它提供给我们有一堆相似的操作,但是要把它用成这个语言该有的样子,精确到哪个文件夹该放什么文件,形成一种开发的风格、规约,这样最好不过Vue cli 2.x版本构建项目目录一览Vue cli 4.x版本构建项目目录一览关于static,assets 文件夹...原创 2019-12-14 23:43:54 · 223 阅读 · 0 评论 -
Vue子组件懒加载,页内导航,平滑过渡
Vue子组件懒加载,页内导航,平滑过渡需求与实现思路想实现类似 elementUI tabs 那种效果, 但是是在单个容器内部,且支持懒加载,点击右侧(点击时才加载对应组件)的nav item 可以跳转到对应的组件区域。(并且在加载后自动跳转到对应区域)懒加载实现方式本例使用条件渲染控制方式,缺点:需要额外配置 v-if 的绑定似乎不是真正意义上的懒加载(似乎)(只是心里过不去而已,毕竟多了个v-if)平滑过渡实现方式mukashi mukashi 在很久很久以前,瞟过一眼张鑫原创 2020-06-30 18:08:05 · 974 阅读 · 0 评论 -
Vue一个组件依赖另一个组件的Api请求结果,如何做到按照顺序取得数据
Vue一个组件依赖另一个组件的Api请求结果,如何做到按照顺序取得数据前言我知道我很菜,但是还是想记录下开发过程中的喜悦,如果这篇文章有帮到你,那我会非常开心。如果你两个请求都放在了一个组件里面,那这篇文章看到这里就不适合您了,您可以叉掉退出。如果你两个请求需要分开,分别放在不相同的组件中,又不好搞成 Promise.all 类似的操作,那么这篇文章可能会帮助到你需求先来看需求,上伪代...原创 2020-04-07 23:10:06 · 2450 阅读 · 1 评论 -
Vue中 乍一看让人懵逼的代码
render: h => h(App)出自 vue cli 构建的 main.js 文件中,首先看看各个版本的写法:components: { App } // vue1.0的写法render: h => h(App) // vue2.0的写法再来看看官方解释:接收一个方法,作为第一参数,这是关键点查资料得出,ES6语法,表示 Vue 实例选项对象的 render...原创 2020-02-26 20:37:23 · 331 阅读 · 0 评论 -
Vuex 入门
Vuex用法前言:vuex, 是vue 的一个插件,作用是 对vue应用中多个组件的共享状态进行集中式的管理(get/set)为解决多组件共享状态问题而生:多个视图依赖于同一个状态来自不同视图的行为需要变更同一个状态以前的解决方法:将数据以及操作数据的行为 全部集中定义在父组件中将数据以及操作数据的行为传递给需要的子组件,(可能要逐层传递)根据vue cli 3...原创 2019-12-14 23:47:43 · 146 阅读 · 0 评论 -
Vue如何在删除router配置的name属性后,还能使用params 传参呢
如何在删除vue-router的name后还使用params 传参呢先来看一下需求:有一个路由,该路由下面有子路由,代码看起来是这样的:{ path:'/user/:id', name:'User' component:() => import ('../views/User'), children:[ { path:'Bas...原创 2020-02-05 22:29:23 · 716 阅读 · 0 评论 -
watch '$route'(to,from)无效 解决方法
watch ‘$route’(to,from)无效组件代码:watch:{ '$route' (to, from) { // 对路由变化作出响应... console.log(to) }},路由配置:{ path:'/user/:id', name:'User', component:() => im...原创 2020-02-04 15:51:58 · 6187 阅读 · 0 评论 -
Vue拿到后端返回的List,渲染出element-tree树结构
前言:这是我的做法,基本上是照葫芦画瓢,我也不知道有没有更好的方法能拿到 tree组件的实例element-tree 增加节点的方法如果在模板中定于了 <el-tree>的数据源如下:<el-tree :data="nodeData"></el>那么在当前Vue组件实例中定义并初始化数据源export default { name: '...原创 2020-01-02 11:26:57 · 5600 阅读 · 1 评论 -
Vue 使用 FontAwesome
Vue 中使用 FontAwesome安装依赖基础依赖npm i --save @fortawesome/fontawesomenpm i --save @fortawesome/vue-fontawesome样式依赖npm i --save @fortawesome/fontawesome-free-solidnpm i --save @fortawesome/fontaweso...原创 2019-12-28 21:31:51 · 203 阅读 · 0 评论 -
Vue Router 入门
Vue Router 学习前言随着ajax兴起,页面请求越来越多,是用来处理单页应用 SPA(single page web application)的不二之选SPA应用特点体现在如下:页面交互是无刷新页面的跳转也是无刷新的原理是 匹配不同的 url 路径,进行解析,然后动态的渲染出区域 html 内容每当切换路由的时候,在DOM中删除上一个路由节点(from),渲染一个...原创 2019-12-14 23:45:53 · 176 阅读 · 1 评论