Vue 进阶
MVVM 框架,轻巧灵活,组件化
凝弧
这个作者很懒,什么都没留下…
展开
-
Vue 路由哈希模式下的锚点定位支持
路由 hash 模式已经将#占用, 页面的锚点功能失效,js 实现替代 <a @click="$tools.goAnchor(0)">定位到顶部</a> <a @click="$tools.goAnchor('#link1')">定位到锚点1</a> <a @click="$tools.goAnchor('#link2')">定位到锚点2</a> <a @click="$tools.goAnchor('#link3')"原创 2020-05-12 13:34:17 · 4646 阅读 · 1 评论 -
Vue-router 路由
vue-router1. hash和history模式2. router-link各种配置项3. 重定向和别名4. 嵌套路由的使用5. 命名视图6. 滚动行为7. 动态路径参数8. 监控$router路由信息对象9. query字符串传参10. 导航切换过渡动画transition使用11. 动态设置name属性左右切换12. 编程式导航13. 全局钩子函数14. ...原创 2018-07-26 23:13:31 · 1819 阅读 · 0 评论 -
Vuex 状态管理模式
Vuex 核心概念使用 VuexstoreStateGetterMutationAction辅助函数Vuex是什么 专为 Vue.js 应用程序开发的 状态管理模式,采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化Vuex 的状态是响应式的,若 store 中的状态发生变化,那么调用 状态 的组件也会更新s...原创 2018-07-29 14:09:48 · 1306 阅读 · 0 评论 -
Vuex 严格模式 & 表单处理 & 热重载
严格模式在该模式下,无论何时发生了状态变更且不是由 mutation 函数引起的,将会抛出错误。 这能保证所有的状态变更都能被调试工具跟踪到。 开启严格模式,仅需在创建 store 的时候传入 strict: true:const store = new Vuex.Store({ // 严格模式会深度监测状态树来检测不合规的状态变更,确保在发布环境下关闭严格模式 str...原创 2018-07-29 14:54:36 · 688 阅读 · 0 评论 -
Vue 学习笔记 03:生命周期钩子
钩子函数钩子函数算是生命周期函数的前生吧,用到的也不多网上找的比较好的一张图贴出来 生命周期函数正如其名,组件从被 创建 到完成使命后的 销毁 的过程,就好比生命的出生到死亡beforeCreate 创建前 可以在这加个 loading 事件,在加载实例时触发created 创建后 初始化完成时的事件写在这里,如在这结束loading事件,异步请求也适宜在这里调用...原创 2018-07-03 07:25:14 · 257 阅读 · 0 评论 -
Vue-cli 3.0 构建项目(二)设置接口代理
vue.config.js vue.config.js是一个可选的配置文件,新建该文件,存放在项目根目录(将自动加载)中// 作为配置文件,直接导出配置对象即可module.exports = { devServer: { // 设置主机地址 host: 'localhost', // 设置默认端口 port: 8...原创 2018-07-21 09:20:37 · 9647 阅读 · 1 评论 -
Vue2+VueRouter2+Webpack+Axios 构建项目实战
Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版(十一)阶段性小结前情回顾去年写的那一套东西,虽然我也写得非常的认真,但是其中还是有点绕了。当时水平不行。现在我重新整理出来的博文如下,希望对各位有所帮助。Vue2+VueRouter2+Webpack+Axios ...转载 2018-06-15 09:25:01 · 281 阅读 · 0 评论 -
Vue-cli 3.0 构建项目(一)构建初始项目
1. 安装 Vue-cli 3.0 脚手架工具2. 初始化项目默认配置自定义配置详细的配置1. 安装 Vue-cli 3.0 脚手架工具终端输入npm install -g vue@cli安装完成后,输入 vue -V 查看是否安装成功 2. 初始化项目vue create &amp;amp;amp;amp;amp;amp;amp;amp;lt;projectName&amp;amp;amp;amp;amp;a原创 2018-06-30 22:29:42 · 8005 阅读 · 0 评论 -
Vue 学习笔记 02:事件修饰符
事件修饰符Vue 为 v-on / @ 绑定事件提供了修饰符,通过 . 来调用修饰符.stop: 阻止事件 冒泡,调用 event.stopPropagation() &amp;amp;amp;lt;a @click.stop=&amp;amp;quot;fn()&amp;amp;quot;&amp;amp;amp;gt;click me&amp;amp;amp;lt;/a&amp原创 2018-05-07 11:04:01 · 360 阅读 · 0 评论 -
Vue 学习笔记 01:指令(内置 + 自定义)
内置指令v-text 输出文本v-html 输出HTMLv-bind 标签属性v-on 事件绑定v-if 显示隐藏v-model 双向数据绑定v-for 遍历v-pre 原始输出v-cloak 闪烁v-once自定义指令全局指令定义局部指令定义钩子函数钩子函数参数内置指令v-text 输出文本输出html代码&amp;lt;d...转载 2018-05-02 19:17:21 · 181 阅读 · 0 评论