前端
文章平均质量分 86
迷鹿小女子
这个作者很懒,什么都没留下…
展开
-
spa项目开发之tab页实现
实现思路及细节 1、利用前面博客所讲的Vuex的知识;定义几个变量 Options:存放tab页对象的容器(主要是路由路径以及tab页的名字) activeIndex:被激活的tab页路由路径 showName:tab页的标题 Role:用来区分是否是因为左侧菜单被点击造成的路由路径发生改变; 是:pass;不是:nopass 2、左侧导航菜单绑定点击事件 将被点击的菜单名称存放到Vuex中,供路...原创 2019-10-22 20:02:27 · 97 阅读 · 0 评论 -
JWT
知识点: 1、服务端如何利用jwt生成token令牌 2、客户端如何接收jwt生成的令牌 3、与传统的session机制差异在哪 1. JWT是什么 JSON Web Token (JWT),它是目前最流行的跨域身份验证解决方案 2. 为什么使用JWT JWT的精髓在于:“去中心化”,数据是保存在客户端的。 3. JWT的工作原理 是在服务器身份验证之后,将生成一个JSON对象并将其发...原创 2019-09-07 11:03:03 · 478 阅读 · 0 评论 -
Vuex
1.图文解释:Vuex中的各个js文件的用途 变量传值的演变形式: 图解Vuex各组件: 官方图解Vuex: 2. vue中各个组件之间传值 1.父子组件 父组件–>子组件,通过子组件的自定义属性:props 子组件–>父组件,通过自定义事件:this.$emit(‘事件名’,参数1,参数2,…); 2.非父子组件或父子组件 通过数据总数Bus,this.root.root.ro...原创 2019-09-05 16:25:02 · 101 阅读 · 0 评论 -
SPA项目开发之表单验证+实现增删改功能
1. 表单验证 Form组件提供了表单验证的功能,只需要通过 rules 属性传入约定的验证规则, 并将Form-Item的prop属性设置为需校验的字段名即可 <!-- 编辑界面 --> <el-dialog :title="title" :visible.sync="editFormVisible" width="30%" @click="closeDialog">...原创 2019-09-03 12:13:40 · 143 阅读 · 0 评论 -
SPA项目开发之动态树+数据表格+分页
1. 后台数据 t_vue_user t_vue_tree_node t_vue_articles 2. 动态生成NavMenu导航菜单(只支持2级菜单) 2.1 结构 <el-menu key="" index=""> <el-submenu> <template slot="title"> ...原创 2019-08-30 14:02:15 · 129 阅读 · 0 评论 -
Vue router报错:NavigationDuplicated {_name: "NavigationDuplicated", name: "NavigationDuplicated"}的解决方法
我最近做SPA项目开发动态树的时候一直遇到以下错误: 当我点击文章管理需要跳转路径时一直报NavigationDuplicated {_name: “NavigationDuplicated”, name: “NavigationDuplicated”}这个错误 但是当我点击文章管理后,路径跳转却是成功的 <template> <div> 文章管理页面 <...原创 2019-08-30 11:44:31 · 7718 阅读 · 6 评论 -
SPA项目开发之首页导航+左侧菜单
1. Mock.js 前后端分离开发开发过程当中,经常会遇到以下几个尴尬的场景: 老大,接口文档还没输出,我的好多活干不下去啊! 后端小哥,接口写好了没,我要测试啊! 前后端分离之后,前端迫切需要一种机制,不再需要依赖后端接口开发,而今天的主角mockjs就可以做到这一点 Mock.js是一个模拟数据的生成器,用来帮助前端调试开发、进行前后端的原型分离以及用来提高自动化测试效率。 众所周知Mo...原创 2019-08-30 09:31:11 · 257 阅读 · 0 评论 -
SPA项目开发之登录注册
本章目标:vue+elementUI完成注册及登陆 1. vue怎么引入和配置使用element-ui框架 1.1 使用vue-cli脚手架工具创建一个vue项目 vue init webpack pro01 1.2 npm安装elementUI cd pro01 #进入新建项目的根目录 npm install element-u...原创 2019-08-27 18:09:26 · 1011 阅读 · 2 评论 -
使用vue-cli搭建SPA项目
本章目标:使用vue-cli来搭建vue项目 0. 前提:搭建好NodeJS环境 node -v npm -v 1. 什么是vue-cli? vue-cli是vue.js的脚手架,用于自动生成vue.js+webpack的项目模板,创建命令如下: vue init webpack xxx 注1:xxx 为自己创建项目的名称 注2:必须先安装vue,vue-cli,webpack,node等一些必...原创 2019-08-26 16:30:00 · 201 阅读 · 0 评论 -
Vue入门
1. Vue.js是什么? Vue是一个构建用户界面(UI)的[渐进式]JavaScript框架 官网:https://cn.vuejs.org/ Vue作者:尤雨溪/中国无锡 2. 库和框架的区别 2.1 库(Library),本质上是一些函数的集合。每次调用函数,实现一个特定的功能,接着把控制权交给使用者 代表:jQuery jQuery这个库的核心:DOM操作,即:封装DOM操作,简化DOM...原创 2019-08-16 21:24:13 · 115 阅读 · 0 评论 -
Vue之模板语法(上)
1. 模板语法 1.1 插值 1.1.1 文本 {{msg}} 1.1.2 html 使用v-html指令用于输出html代码 1.1.3 属性 HTML属性中的值应使用v-bind指令 1.1.4 表达式 Vue提供了完全的JavaScript表达式支持 {{str.substr(0,6).toUpperCase()...原创 2019-08-19 18:59:14 · 334 阅读 · 0 评论 -
Vue之模板语法(下)
1. 样式绑定 1.1 class绑定 使用方式:v-bind:class=“expression” expression的类型:字符串、数组、对象 1.2 style绑定 v-bind:style=“expression” expression的类型:字符串、数组、对象 2. 事件处理器 事件监听可以使用v-on 指令 之前已学习 2.1 事件修饰符 Vue通过由点(.)表示的指令后缀来调用修饰...原创 2019-08-22 14:47:21 · 154 阅读 · 0 评论 -
Vue路由
1. SPA是什么 单页Web应用(single page application,SPA),就是只有一个Web页面的应用, 是加载单个HTML页面,并在用户与应用程序交互时动态更新该页面的Web应用程序 单页面应用程序: 只有第一次会加载页面, 以后的每次请求, 仅仅是获取必要的数据.然后, 由页面中js解析获取的数据, 展示在页面中 传统多页面应用程序: 对于传统的多页面应用程序来说, 每次请...原创 2019-08-22 19:59:34 · 117 阅读 · 0 评论 -
nodeJS环境搭建
1. Node.js是什么 1.1 Node.js是一个基于Chrome V8引擎的[JavaScript运行环境]。 Node.js使用了一个事件驱动、非阻塞式I/O 的模型。 1.2 Node.js是一个让JavaScript运行在服务端的开发平台,它让JavaScript成为与PHP、Python、Perl、Ruby等服务端语言平起平坐的脚本语言 注1:Node.js-->JavaSc...原创 2019-08-23 17:10:31 · 127 阅读 · 0 评论