随笔分类 - Vue
摘要：一、django项目的部署 （一）django项目的搭建 1、搭建虚拟环境 项目是需要依赖环境的，所以我们需要先创建一个虚拟环境： C:\Users\Administrator>mkvirtualenv django-vue-demo --no-setuptools Using real prefi
阅读全文
摘要：一、问题背景 之前使用django+vue进行前后端分离碰到跨域请求问题，跨域（域名或者端口不同）请求问题的本质是由于浏览器的同源策略导致的，当请求的响应不是处于同一个域名和端口下，浏览器不会接受响应，同源策略也是浏览器针对请求的安全问题所作出的一种保护行为。针对跨域问题，可以有下面的解决方式： J
阅读全文
摘要：一、vue基础 使用vue需在官网上先下载vue.js，网址：https://cn.vuejs.org/v2/guide/installation.html。然后： 在project中引入vue.js vue实例化 当进行实例化后，传入一个选项对象，其中以key-value存在的键值对，像el对象的
阅读全文
摘要：在项目开发中，往往需要使用到一些公共组件，比如，弹出消息、面包屑或者其它的组件，为了使用方便，将其以插件的形式融入到vue中，以面包屑插件为例： 1、创建公共组件MyBread.vue 2、在main.js中全局注册到vue中 3、使用 在需要的组件中可以直接使用，注意需要父子传值
阅读全文
摘要：ref 被用来给元素或子组件注册引用信息。引用信息将会注册在父组件的 refs.标签的ref的名来获取
阅读全文
摘要：一、module的作用 由于使用单一状态树，应用的所有状态会集中到一个比较大的对象。当应用变得非常复杂时，store 对象就有可能变得相当臃肿。 为了解决以上问题，Vuex 允许我们将 store 分割成模块（module）。每个模块拥有自己的 state、mutation、action、gette
阅读全文
摘要：一、使用方式 全局前置守卫用于在路由配置生效之前进行一些动作，可以使用 router.beforeEach 注册一个全局前置守卫： 参数： to: Route: 即将要进入的目标 路由对象 from: Route: 当前导航正要离开的路由 next: Function: 一定要调用该方法来 reso
阅读全文
摘要：一、动态菜单API的生成 1、API 2、MenuModelView 在restframework框架的认证组件中通过 authentication_classes = [AuthToken]进行认证，获得user，从而传入user，从而初始化菜单数据，然后根据数据库中的positionid可以进行
阅读全文
摘要：一、axios的封装 在vue中为了使用axios使用方便，不需要每一个模块进行导入，就需要对其进行封装： 1、新建http.js模块 2、在main.js中导入 此时vue实例中已经有$http方法了 3、在需要的地方进行调用 二、拦截器的使用 拦截器是在发送请求之前做一些动作，比如将将token
阅读全文
摘要：一、什么是过滤器？ 过滤器是对即将显示的数据做进一步的筛选处理，然后进行显示，值得注意的是过滤器并没有改变原来的数据，只是在原数据的基础上产生新的数据。 二、过滤器的使用 1、定义过滤器 全局过滤器 局部过滤器 2、过滤器使用的地方 三、实例 1、传递一个参数的全局过滤器 2、传递多个参数的局部过滤
阅读全文
摘要：1、插件的作用 插件通常会为 Vue 添加全局功能，一般是添加全局方法/全局指令/过滤器等 Vue 插件有一个公开方法 install ，通过 install 方法给 Vue 添加全局功能 通过全局方法 Vue.use() 使用插件，它需要在你调用 new Vue() 启动应用之前完成. 2、开发插
阅读全文
摘要：一、事件处理方法 1、格式 完整格式：v-on:事件名="函数名" 或 v-on:事件名="函数名(参数……)" 缩写格式：@事件名="函数名" 或 @事件名="函数名(参数……)" 注意：@后面没有冒号 event ：函数中的默认形参，代表原生 DOM 事件 当调用的函数，有多个参数传入时，需要使
阅读全文
摘要：1、自定义指令的作用 除了核心功能默认内置的指令 (v-model 和 v-show)，Vue 也允许注册自定义指令。注意，在 Vue2.0 中，代码复用和抽象的主要形式是组件。然而，有的情况下，你仍然需要对普通 DOM 元素进行底层操作，这时候就会用到自定义指令。 参考文档：https://cn.
阅读全文
摘要：1、定义路由 2、使用 router-link 组件来导航 在左侧菜单栏的Vleft组件中使用router-link 2.1 加入默认样式 默认选中的样式是在li标签上加上class="active" 2.1.1 tag 如果想要 <router-link> 渲染成某种标签，例如 <li>。 可以使
阅读全文
摘要：由于使用单一状态树，应用的所有状态会集中到一个比较大的对象。当应用变得非常复杂时，store 对象就有可能变得相当臃肿。 为了解决以上问题，Vuex 允许我们将 store 分割成模块（module）。每个模块拥有自己的 state、mutation、action、getter、甚至是嵌套子模块——
阅读全文
摘要：一、环境安装 1、axios的安装 进入到对应工程目录执行： 2、启动测试数据的API 测试项目地址：https://github.com/ShenJianPing0307/VueTestAPI 二、使用axios 使用文档：https://github.com/axios/axios 1、发送ge
阅读全文
摘要：一、生命周期图示 生命周期可以理解为三部分，第一部分为初始化Vue实例的过程，第二部分为数据渲染，更新Dom的过程，第三部分为销毁实例的过程，每一个部分都有对应的钩子函数来完成对应的部分过程。 初始化阶段的钩子函数： 更新阶段的钩子函数： 销毁阶段的钩子函数： 二、实例演示 1、beforeCrea
阅读全文
摘要：一、初始化项目 1、下载模板 进入github中https://github.com/tastejs/todomvc-app-template，并且在命令行将其clone下来 2、安装依赖 进入项目目录中安装依赖 3、引入vue.js文件 首先在命令行中安装vue 然后再index.html中引入
阅读全文
摘要：一、实现效果 二、实现 （一）实现增加用户功能 Vuserlist组件中 <template> <div class="panel panel-default"> <div class="panel-body"> <!--<button type="button" class="btn btn-in
阅读全文
摘要：一、子组件执行父组件中的方法 1、父组件将方法名传给子组件，子组件进行调用 父组件中： 子组件中： 2、子组件里用$emit向父组件触发一个事件，父组件监听这个事件 父组件中： 子组件中： 二、父组件执行子组件中的方法 子组件： 父组件： （1）在子组件中写入相应的方法 （2）在父组件中引入子组件
阅读全文
