![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
于丸
想做个前端大
展开
-
vue的class
//item是变量,add和jian是class名字:class="[item > 0? 'add' : 'jian']"//tabActive是类名,activeId是变量:class="{'tabActive':activeId == 1}"原创 2020-07-07 13:14:22 · 214 阅读 · 0 评论 -
vue源码分析之视图连接数据(四)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="app"> <div> ...原创 2019-11-22 09:31:47 · 132 阅读 · 0 评论 -
vue源码分析之模板编译(三)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body> <div id="app"> <div>...原创 2019-11-22 09:31:00 · 131 阅读 · 0 评论 -
vue源码分析之数据代理(二)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body> <script> // 判断是不是对象类型 funct...原创 2019-11-22 09:29:56 · 116 阅读 · 0 评论 -
vue源码分析之数据劫持(一)
vue源码分析之数据劫持<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body></body><script> ...原创 2019-11-22 09:29:22 · 322 阅读 · 0 评论 -
vue递归组件
//父组件<template> <div> <digui :label="data.label" :children="data.nodes" :depth="depth"></digui> </div></template><script> import digui...原创 2019-08-27 15:12:08 · 71 阅读 · 0 评论 -
vue总线方式传参
//bus.jsimport Vue from "vue";const Bus = new Vue();export default Bus; //组件A、组件B中分别引入Busimport Bus from "bus.js的路径"; //组件A中绑定事件,来接收组件B传来的数据//绑定事件Bus.$on("绑定事件",data=>{ console.log(...原创 2019-09-01 17:21:51 · 382 阅读 · 0 评论 -
vue发布订阅模式简易实现
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <script> function Dep(){ this.fl = [] } ...原创 2019-09-02 13:14:29 · 501 阅读 · 0 评论 -
vue返回不刷新页面
router里的index.js{ //账套-基本信息管理 path: '/home/zhangtao/base_message_manage', name: '', component: resolve => require(['@/pages/zhangtao/b...原创 2019-09-20 09:18:53 · 1418 阅读 · 0 评论 -
vue实现oss上传
//js中写入export default{ install(Vue){ Vue.prototype.$ali = { //阿里云OSS key参数 region: 'oss-cn-beijing', accessKeyId: '...原创 2019-08-07 10:40:39 · 3099 阅读 · 0 评论 -
vue项目中use的使用
//新建j文件//第一种方式export default{ install(vue,a){ vue.prototype.yuchunhui = a }} //第二种方式export default function(vue,a){ vue.prototype.yuchunhui = a}//在main中引入import xxx from "js文件路径"Vue.use(...原创 2019-08-07 09:14:29 · 369 阅读 · 0 评论 -
简易代码回答vue的数据代理
<script> //假设这就是vue实例 const vm = { //我们自己定义的data data:{ a:1, b:2 } } function proxy(key) { Object.defineProperty(vm,key, { get() { ...原创 2019-08-03 21:48:22 · 169 阅读 · 0 评论 -
vue用路由守卫判断是否已经登录
router.beforeEach((to,from,next)=>{ let user = localStorage.getItem('user') if(user == null){ user = false }else{ user = true } if (to.path != "/password_login")...原创 2019-05-31 13:41:55 · 590 阅读 · 0 评论 -
省市县联动
省市县联动原创 2019-05-31 14:12:58 · 165 阅读 · 0 评论 -
vue的watch总结
//最普通的用法<div> <p>FullName: {{fullName}}</p></div> watch: { firstName(newName, oldName) { } } //上面的例子是值变化时候,watch才执行,我们想让值最初时候watch就执行就用到了handler和imm...原创 2019-06-13 14:23:39 · 110 阅读 · 0 评论 -
mixins混入的使用
//需要注意的是要想用混入,组件中就不要定义混入对象中的data和methods//插一句小程序框架的不同:对于组件methods响应事件,先响应组件本身响应事件,然后再响应混合对象中的响应事件(wepy)。//我在这里目的是在缓存中取俩个值,因为每个页面都要用,所以写在混入文件里//第一步 创建混入的js文件export default { data( return{ ...原创 2019-06-13 14:54:33 · 179 阅读 · 0 评论 -
前端实现导出功能
npm install file-saver xlsx --save-devimport elxel from './assets/js/elxel'Vue.use(elxel)//调用elxel公共方法,exportFunc('要导出表格选择器id','导出表格的名称'); <el-button type="success" @click="exportFunc('listTab...原创 2019-07-02 10:37:20 · 1393 阅读 · 0 评论 -
前端实现excel文件导入
npm install file-saver xlsx -S npm install script-loader -D<template> <div> <el-upload :show-file-list="false" action="" ...原创 2019-07-03 11:18:02 · 511 阅读 · 0 评论 -
图片懒加载
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> .image-item { display: inline-block; width: 100%; height: 3...原创 2019-07-11 13:52:34 · 174 阅读 · 0 评论 -
微信扫码登录前端要做的工作
<div id="div" style="z-index: 100;"></div>mounted(){ var obj = new WxLogin({ id:"div", //div的id appid: "wx3b976ef54d06d852", ...原创 2019-07-16 11:06:03 · 2576 阅读 · 4 评论 -
vue刷新页面
父页面<router-view v-if="isRouterAlive"></router-view>export default { provide () { return { reload: this.reload } }}methods: { ...原创 2019-05-31 10:13:09 · 207 阅读 · 0 评论