随笔分类 - vue
1
vue相关文章
摘要：5.3.Vuex的核心概念 5.3.1.Mutation 注意； 在Mutation中，是不能提交异步代码的，例如： 5.3.2.Action 在mutation中提交异步代码,状态的改变是没办法追踪的，如果有异步代码，需要放到Action中去,等异步代码执行完成后再提交 store/index.j
阅读全文
摘要：5.2、使用vuex重构上面代码 Vuex是什么？官方定义：Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化 Vuex的使用步骤： 1 安装Vuex 2 在src目录下，新建store文件夹，在
阅读全文
摘要：5.状态管理 5.1.兄弟组件之间共享数据的问题? 首先，我们需要了解下兄弟组件之间如何共享数据的问题 完成下列需求： 本案例目录结构： 核心代码： GoodsDemo.vue GoodsItem.vue ShoppingCar.vue 从上面代码中，我们来看看数据是怎么传输的 螺钉课堂视频课程地址
阅读全文
摘要：4.7.作为vue的插件使用 在vue中，我们不需要在每个组件中都去引入axios，这样使用起来比较麻烦，我们可以结合插件vue axios，让操作更简化 1.安装插件 2.在入口文件中引入模块，并挂载插件 main.js 3.在组件中使用axios 螺钉课堂视频课程地址：http://edu.no
阅读全文
摘要：4.5.创建实例 可以创建一个自定义实例应用于多个请求接口 实例中的相关配置： { // 是用于请求的服务器 URL url: '/user', // 是创建请求时使用的方法 method: 'get', // 默认是 get // 将自动加在 前面，除非 是一个绝对 URL。 // 它可以通过设置
阅读全文
摘要：4.数据请求 4.1.axios是什么？ axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端，它有以下特征： 4.2.简单使用 1.安装axios 2.使用axios发送get请求 在组件内部导入axios，这里以Demo1.vue为例： 在created中发送请
阅读全文
摘要：3.11.1.vue router中的全局钩子函数 在vue router中，路由发生变化，我们可以做一些事情，例如：可以决定是否进入导航，可以决定跳转到哪里，官方文档中又叫做导航守卫 首先来看一个全局的钩子函数，官方文档中叫做注册一个全局的前置守卫，使用router.beforeEach方法来实现
阅读全文
摘要：3.9.滚动行为 设置滚动行为的作用是导航到新路由时，让页面滚动到你想要的位置。 注意: 这个功能只在支持 history.pushState 的浏览器中可用。 3.10.过渡效果 vue中封装了一套transtion组件，可以提供过渡效果 3.10.1.通过过渡css类名的方式来设置过渡效果 过渡
阅读全文
摘要：3.8.动态路由匹配和路由组件传参 3.8.1.动态路由匹配 动态路由意味着不固定，具有某种模式，我们希望通过某种匹配方式，把这种不固定的路由形势映射到同一个组件，例如：一个User组件，不同的ID表示不同的用户，即/user/1、/user/2、/user/3，这些不同用户所对应的路由，我们都希望
阅读全文
摘要：3.6.重定向和别名 3.6.1.重定向 路由重定向通俗的说就是从一个路由重新定位跳转到另一个路由，例如：访问的 “/a” 重定向到“/b” 重定向也是通过配置routes选项完成的 上面代码中，访问 ‘/hello’ 并不会去渲染Hello组件，而是会跳转到路由‘/course’，去渲染cours
阅读全文
摘要：3.4.嵌套路由 实际生活中的应用界面，通常由多层嵌套的组件组合而成。同样地，URL 中各段动态路径也按某种结构对应嵌套的各层组件，例如： 再来看看下面这种更直观的嵌套图： 接下来我们需要实现下面这种效果 核心代码： 1.需要在vip组件中增加嵌套代码 2.在路由配置文件中，需要为vip配置chil
阅读全文
摘要：3.3.router link配置 3.3.1.实例 需求：实现下面效果，点击不同的菜单，显示不同的文字 核心代码：App组件 路由配置：index.js 3.3.2.使用router link实现跳转 核心代码：App组件 3.3.3.router link的其他配置 1.可以动态绑定一个变量 核
阅读全文
摘要：3.路由切换 3.1.vue router路由切换 3.1.1.什么是前端路由 路由这个概念最先是后端出现的，发送不同的请求，后端根据请求的不同返回不同的资源，这个时候的url是和后端交互的，需要在后端去配置路由的跳转，这种开发方式有两个特点，一是整个项目中前端代码和后端代码是柔在一起的，通常都是需
阅读全文
摘要：1.环境搭建 1.1.脚手架搭建 1.1.1什么是脚手架 百度搜索一下脚手架长什么样子，它们是这样的: 从百度百科抄过来一段话： 脚手架是为了保证各施工过程顺利进行而搭设的工作平台。如果明白了脚手架在现实生活中的作用，那么，再来理解编程中的脚手架就容易了，有时我们听说前端脚手架工具，其实，这里的脚手
阅读全文
摘要：4.综合实例 4.1.基于数据驱动的选项卡 4.1.1.需求 4.1.2.代码实现 4.1.2.练习作业 尝试完成下一节课程的需求，请保持自己独立实现，不要先看实现的代码 4.2.后台管理菜单 4.2.1.需求 4.2.2.相关资源下载地址 静态文件下载地址 4.2.3.代码实现 <!DOCTYPE
阅读全文
摘要：3.组件基础 3.1.什么是组件？ 3.1.1.理解组件 前端组件化开发是目前非常流行的方式，什么是前端组件化开发呢？就是将页面的某一部分独立出来，将这一部分的数据、视图、以及一些控制逻辑封装到一个组件内部，暴露一些开箱即用的函数或者属性供外部组件调用。这种组织代码的开发方式我们称为组件化开发。通俗
阅读全文
摘要：2.3.样式绑定 2.3.1.绑定class样式 1.绑定单个class 2.绑定多个样式 3.可以根据值来确定是否显示某个样式 2.3.2.绑定style样式 1.把所有样式写到一个对象中 上面代码中需要注意的是css中background color,需要去掉‘=’，然后把color首字母大写，
阅读全文
摘要：2.2.基础指令 2.2.1.什么是指令 指令 (Directives) 是带有 v 前缀的特殊特性,指令特性的值预期是单个 JavaScript 表达式,指令的职责是，当表达式的值改变时，将其产生的连带影响，响应式地作用于 DOM 上面代码中v if就是一个指令，用来处理条件判断，根据表达式的值的
阅读全文
摘要：2.vue基础用法 2.1.事件处理 2.1.1.监听事件 使用v on:事件名称 = '事件处理函数'的形式来监听事件，事件处理函数要写在methods后面的对象中 如果事件处理函数需要传参数的话，可以写成这样： 2.1.2.事件修饰符 事件修饰符是帮助我们去处理事件相关细节的，例如，防止事件冒泡
阅读全文
摘要：1.vue初体验 1.1.vue简介 1.1.1.vue是什么？ Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架，什么叫做渐进式呢？通俗的讲就是一层一层的，一步一步的来做事情的方式。什么又是框架呢？可以理解为一套完整的解决方案。总结起来理解，vue是一个框架，提
阅读全文
1
浙公网安备 33010602011771号