vue
珩-琛
这个作者很懒,什么都没留下…
展开
-
Vue项目中实现用户登录及token验证
在前后端完全分离的情况下,Vue项目中实现token验证大致思路如下:1、第一次登录的时候,前端调后端的登陆接口,发送用户名和密码2、后端收到请求,验证用户名和密码,验证成功,就给前端返回一个token3、前端拿到token,将token存储到localStorage和vuex中,并跳转路由页面4、前端每次跳转路由,就判断 localStroage 中有无 token ,没有就跳转...原创 2019-11-28 18:01:46 · 565 阅读 · 0 评论 -
H5页面设置背景图,微信可浏览背景图
最近做项目需要在微信播放视频,设置播放的背景图,折腾了好久 <div class="video-back" :style="{backgroundImage: 'url(' + info.thumbnail_url + ')', }"> <video :src="info.video_url" class="container" controls :poste...原创 2019-11-07 11:35:41 · 2051 阅读 · 0 评论 -
vue 多个路由路由跳转created不执行
问题今天做项目的时候发现,vue页面路由跳转的时候,created函数不执行。created() { },解决办法使用watch函数监听路由即可。 watch:{ '$route'(to,from){ } },响应路由参数的变化提醒一下,...原创 2019-08-29 18:19:54 · 5183 阅读 · 0 评论 -
vuex的mutations和action传参案例
对于项目结构单一store的传参这里不重复讲了,可以看上一篇提到的案例。下面要讲得是项目文件结构分开的传参。├── index.html├── main.js├── api│ └── ... # 抽取出API请求├── components│ ├── App.vue│ └── ...└── store ├── index.js # 我们组装...原创 2019-08-27 12:02:20 · 332 阅读 · 0 评论 -
vuex入门及案例分析
官方参考网站:https://vuex.vuejs.org/zh/installation.html使用NPM方式安装npm install vuex --save在一个模块化的打包系统中,您必须显式地通过Vue.use()来安装 Vuex:import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)当使用全...原创 2019-08-27 11:31:40 · 263 阅读 · 0 评论 -
vue组件及路由
Vue.js 组件组件(Component)是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素,封装可重用的代码。组件系统让我们可以用独立可复用的小组件来构建大型应用,几乎任意类型的应用的界面都可以抽象为一个组件树:注册一个全局组件语法格式如下:Vue.component(tagName, options)tagName 为组件名,options 为配置...原创 2019-08-21 17:41:39 · 278 阅读 · 0 评论 -
Vue的计算属性
计算属性关键词: computed。计算属性在处理一些复杂逻辑时是很有用的。可以看下以下反转字符串的例子:<div id="app"> <p>原始字符串: {{ message }}</p> <p>计算后反转字符串: {{ reversedMessage }}</p></div><script...原创 2019-08-21 11:44:30 · 192 阅读 · 0 评论 -
vue的条件及循环语句
v-if 指令条件判断使用 v-if 指令:在元素 和 template 中使用 v-if 指令:<div id="app"> <p v-if="seen">现在你看到我了</p> <template v-if="ok"> <h1>菜鸟教程</h1> <p>学的不仅是技术,更是梦想!</p&...原创 2019-08-21 10:55:28 · 306 阅读 · 0 评论 -
Vue的模板语法
Vue.js 使用了基于 HTML 的模版语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。Vue.js 的核心是一个允许你采用简洁的模板语法来声明式的将数据渲染进 DOM 的系统。结合响应系统,在应用状态改变时, Vue 能够智能地计算出重新渲染组件的最小代价并应用到 DOM 操作上。插值文本数据绑定最常见的形式就是使用 {{...}}(双大括号)的文本插值...原创 2019-08-21 09:16:05 · 132 阅读 · 0 评论 -
vue安装
由于 npm 安装速度慢,本教程使用了淘宝的镜像及其命令 cnpm,安装使用介绍参照:使用淘宝 NPM 镜像。npm 版本需要大于 3.0,如果低于此版本需要升级它:# 查看版本$ npm -v2.3.0#升级 npmcnpm install npm -g# 升级或安装 cnpmnpm install cnpm -g在用 Vue.js 构建大型应用时推荐使用 NPM...原创 2019-08-20 11:55:48 · 125 阅读 · 0 评论 -
Vue的组件的export default,new Vue
Vue 是通过 webpack 实现的模块化,因此可以使用 import 来引入模块,例如:import Vue from 'vue';import App from './App';import router from './route';import axios from 'axios';import './less/index'; 此外,你还可以在 bulid/web...原创 2019-06-12 11:30:03 · 3630 阅读 · 0 评论 -
vue 总结一项目建立及文件夹结构配置
项目配置首先,按官方指引,使用 vue-cli 搭建 vue 的项目,在项目里按照上面的文档尝试修改,加深理解:# 安装依赖库,建议指定 vue 和 element 版本,避免版本升级带来意料之外的 bug$ npm install vue@2.1.6 element-ui@1.4.6 vuex axios#全局安装脚手架$ npm install -g vue-cli ...原创 2019-06-11 16:38:35 · 3101 阅读 · 1 评论