![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
不认输的西瓜
这个作者很懒,什么都没留下…
展开
-
Element UI 菜单高亮设置
其实这个功能在element ui官方文档中有写其实主要是这两个属性 <el-menu :default-active="$route.path" router> <el-submenu index="1"> <template slot="title"> <span>菜单栏</span原创 2020-10-22 15:36:53 · 2674 阅读 · 1 评论 -
vue-cli配置域名访问报错:Invalid Host header(无效的主机头)
在开发vue-cli脚手架项目的时候,配置了host : 127.0.0.1 dev.com想通过dev.com:8080去访问项目,dev.com这个域名后端已经配置好了跨域但是访问的时候会报Invalid Host header(无效的主机头)错误上解决方法:要修改webpack的配置,在项目的根目录下增加vue.config.js 文件module.exports = { productionSourceMap: false, devServer: { historyApi原创 2020-10-21 18:27:16 · 2122 阅读 · 1 评论 -
vue 路由守卫 beforeEach (防止死循环)
代码写在router.js中,每次路由变化都会调用一次,这样不好的是获取用户的接口可能会调用多次,之后会对这里进行优化。关于路由守卫暂时只使用了这种,先记录下来,之后有时间学习其他的还会更新~// 路由守卫router.beforeEach((to, from, next) => { getUser().then(res => { // 未登录 if(res.resCode === 201){ const reBacklocation= window.loca原创 2020-06-15 16:41:31 · 1239 阅读 · 0 评论 -
iframe页面向父页面传值——postMessage用法
最近在做系统的迁移,需要将老的系统作为iframe嵌入到新系统中,其中某些信息需要通过iframe的页面传到父页面中,调用contentWindow,因为新系统和老的系统域名不一样,会报跨域问题,最后选择了postMessage这种方法。用法:iframe的页面中:window.parent.postMessage(你要传递的值,传递到那个域名);如:window.parent.postMessage('变量a','http://xxx.com');我是使用的vue,所以在create中监听原创 2020-06-11 11:19:56 · 2731 阅读 · 0 评论 -
vue生成uuid唯一标识
最近在写代码的时候,需要向后端传一个唯一字段作为标识,当多次提交内容不变的时候,标识不改,如果有内容改变,则标识改变,借鉴了一位大佬的uuid代码,但是太不好意思忘记是谁了,vue 使用watch监听对象的变化,如果变了调用一遍uuid的函数并且存在一个字段里就可以了。uuid() { var s = []; var hexDigits = '0123456789abcdef'; for (var i = 0;原创 2020-05-08 20:01:14 · 13795 阅读 · 1 评论 -
vue通过控制某个字段来决定是否启用点击事件
在项目中遇到一种情况,刚开始的时候卡片不能点击,在经过某个操作后,卡片的点击事件启动,可以被点击并执行事件内的代码。通过控制flag来控制点击事件是否启用第一种方法:<img src="poker.png" @click="flag && recard()" >第二种方法使用v-if:<button v-if="!show" @click="click...原创 2019-11-25 11:13:16 · 1776 阅读 · 0 评论 -
零基础学习 Vue.JS ——(1)
vue.js是一种最近很流行的轻量级MVVM框架。 那什么是MVVM架构呢? MVVM主要分三部分:View,ViewModel,Model。 它们之间的关系是两两之间信息双向传递,当View中有信息改变时自动反映在ViewModel,反之也是如此。 这样的设计给我们后期修改以及维护带来了很大的便利。前端技术近几年的发展可以说是很迅速了,同时对于前端的技术也是越来越高,在做复杂的项目时...原创 2018-08-21 15:16:12 · 2337 阅读 · 0 评论 -
零基础学习 Vue.JS ——(2)
Vue.js观察属性 Vue提供了watch属性这种更通用的方式来观察和响应数据的变动 watch属性的回调函数没有返回值,回调函数可以执行一些复杂的任务,比如绘制图形等。因为watch属性没有返回值,所以不适合在表达式中使用。&amp;amp;lt;!DOCTYPE html&amp;amp;gt;&amp;amp;lt;html lang=&amp;quot;en&amp;quot;&am原创 2018-08-25 15:54:33 · 380 阅读 · 0 评论 -
零基础学习 Vue.JS ——(3) 指令篇
在 Vue.js 的模板中,除了可以有插值之外,还可以含有指令。Vue.js 的指令比 AngularJS 要简单得多,也更容易掌握。那么什么是指令呢?指令是带有 v- 前缀的特殊属性,指令的职责就是当其表达式的值改变时, 相应地将某些行为应用到 DOM 上。指令必须是属性!!!<div v-if="role==admin"> <ul> ...原创 2018-08-27 10:33:58 · 294 阅读 · 0 评论 -
零基础学习 Vue.JS ——(4) 事件篇
过滤器vue.js允许自定义过滤器用来作为一些常见文本的格式化,比如将字母由小写转为大写或者截取某个字符串的一部分。 过滤器可以用在两个地方:插值和v-bind指令。在vue1.0中有一些过滤器,但是在vue2.0中所有过滤器 都被废弃了,需要用户自定义过滤器。&lt;p&gt;{{username|uppercase}}&lt;/p&gt;过滤器可以串联&lt;p&原创 2018-09-03 08:52:17 · 173 阅读 · 0 评论 -
零基础学习 Vue.JS ——(5) 组件篇
Vue.js 允许用户自定义 HTML 组件,来封装复杂的内容,提高可重用性。 比如封装复杂的表格组件、日历组件、图片轮播组件等等。全局组件就是每个 Vue 对 象都能使用的组件,局部组件只能在某个 Vue 对象之内使用。全局组件全局组件是通过 Vue.component() 函数声明注册的组件,每个 Vue 实例都能使用全局组件<!DOCTYPE html>&l...原创 2018-09-03 17:04:36 · 187 阅读 · 0 评论 -
零基础学习 Vue.JS ——(6) 过渡与动画
vue.js在插入或者更新DOM元素时,提供了许多不同的过渡方式和动画效果。过渡效果transition封装组件可以给任何元素和组件添加过渡效果<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>原创 2018-09-04 10:08:28 · 181 阅读 · 0 评论 -
零基础学习 Vue.JS ——(7) 路由与混合
前端路由前端路由在可多的框架中都得到支持,比如Angular.js、vue.js。 前端路由的主要作用就是让所有的交互在一个页面完成,从而减少服务器的请求,提高用户体验。现在越来越多的网站都应用到了前端路由的技术。前端路由模板 使用前端路由,我们需要引入vue-router.js。vue-router是vue.js官方的路由插件,适用于构建单页面。 下载地址:vue-rout...原创 2018-09-05 08:44:09 · 377 阅读 · 0 评论 -
解决mac版 vue搭建环境
首先下载一下node.js : node.js下载地址一、首先为Mac系统安装brew,打开终端执行命令/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"安装成功后输入命令brew -v查看一下是否安装成功和brew的版本信息。...原创 2018-09-07 20:01:42 · 1816 阅读 · 4 评论 -
解决windows下搭建vue环境
刚刚解决了mac下vue的搭建环境,发现自己的教程是mac版的,而且两者并不是十分相似,吐血…. 只能再拿windows版的搭建一个。一、首先还是安装Node.js。下载地址 我的windows是64位专业版的,所以我下载的是windows installer 64位。 傻瓜式安装下一步下一步,安装完成在cmd中输入命令npm 查看是否安装成功。二、安装淘宝npm镜像 在c...原创 2018-09-09 18:33:44 · 284 阅读 · 0 评论 -
vue实战仿微信小项目,写死的数据不涉及到后台。
学习了一段时间的vue基础,参考教程简单的敲了一个小项目。模仿的聊天室界面。需要配置的环境:1.配置好vue的搭建环境,配置nuxt.js环境2.下载jquery插件,需要引入jquery,可以使用指令npm install jquery下载.具体搭建步骤可参考:mac版vue搭建(https://blog.csdn.net/qq_40678503/article/details/825...原创 2018-09-26 09:07:56 · 1297 阅读 · 0 评论