![](https://img-blog.csdnimg.cn/20190908214022711.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
Vue
ZH_TX
这是一个自我记录的博客,意在防止自己遗忘,帮助自己成长的博客
如果能顺手帮助到你,给与你一点帮助,那是我十分乐意的
展开
-
5/7 总结
判断是否数据更新, 可以通过 , $(form ::input).change() ,触发了表明值发生了变化原创 2021-05-07 23:04:49 · 88 阅读 · 0 评论 -
webpack 复制插件踩坑
需求: 把打包后的文件复制到外层, 然后Git 提交的时候会自动加上,达到自动发布的流程;起初本来想使用copy webpack plugin,发现只能用在构建中;后来发现 file webpck plugin 可以达到这种效果(配置如下)特别问题:如何 去编写一个webpack 插件???参考另一种解决方式, 直接使用 node 脚本延时复制是不是也可以达到效果const CopyWebpackPlugin = require('copy-webpack-plugin')con.原创 2021-04-12 21:13:28 · 208 阅读 · 0 评论 -
学习总结(20210327)
对于组件弹窗的标准使用, 应该先设置visible 然后watch其状态变化, 具体参考element 组件的实现对于表单赋值的时,最好写定义好一个变量(先深拷贝),在赋值给data中绑定的属性对于复现时,可能会出现的情况,先在this.$nextTick中赋值,不然可能resetFilds()可能清除出现问题多看看标准官方的实现组件的场景(以后的学习的方向(深入))...原创 2021-03-27 19:10:58 · 83 阅读 · 0 评论 -
前端代码规范 小结
自己做出的一些规范总结针对于vue:props: 名字最好对应起来:// goodexport default { props: { 'greeting-text': String, },};// badexport default { props: { greetingText: String, },};<!-- good --><welcome-message greeting-text="hi" /><!-- ba原创 2021-03-01 21:07:06 · 135 阅读 · 0 评论 -
vue两个面试题
链接:https://zhuanlan.zhihu.com/p/352543464vue面试题,“请详细说下你对vue生命周期的理解”。vue生命周期总共分为8个阶段创建前/后,载入前/后,更新前/后,销毁前/后。创建前/后:在beforeCreated阶段,vue实例的挂载元el还没有。载入前/后:在beforeMount阶段,vue实例的$el和data都初始化了,但还是挂载之前为虚拟的dom节点,data.message还未替换。在mounted阶段,vue实例挂载完成,data转载 2021-02-28 18:34:55 · 165 阅读 · 0 评论 -
vue 自定义指令
参考:自定义指令常用指令vue的自定义指令可以vue.directive 全局注册,可以使用directives 进行局部注册// 注册一个全局自定义指令 `v-focus`Vue.directive('focus', { // 当被绑定的元素插入到 DOM 中时…… inserted: function (el) { // 聚焦元素 el.focus() }})//如果想注册局部指令,组件中也接受一个 directives 的选项:-------------原创 2020-11-29 12:39:28 · 154 阅读 · 1 评论 -
vue.config.js 详细配置说明(vue-cli4)
详细说明参考:链接一链接二链接三先按需引入cnpm install --save-dev compression-webpack-plugincnpm install --save-dev image-webpack-loader // vue.config.jsconst path = require('path');const CompressionWebpackPlugin = require("compression-webpack-plugin"); // 开启gzi原创 2020-11-10 22:07:26 · 425 阅读 · 0 评论 -
小程序的心得
使用小程序传参的时候没法像vue一样放在函数中, 只能使用data-*,来传递参数小程序中有template,来复用,import, includevue中的computed可分为get, 与set, 默认是get对于一个新项目,要做好初始化的工作,例如提示,request的一些封装...原创 2020-11-08 18:56:13 · 143 阅读 · 0 评论 -
关于Vue组件通信的总结
一个比较全而好的总结:写的很不错: 值得我在工作中使用:vue深度总结vue filter,常用函数: filter妙用原创 2020-11-08 18:54:32 · 73 阅读 · 0 评论 -
h5的初始化
vue项目的初始化移动端的的尺寸自适应(pxtorem)移动端点击的300ms延迟原创 2020-09-17 23:13:01 · 561 阅读 · 0 评论 -
vue实例:增删改查以及搜索
对于初学者而言这是一个比较好的实例项目吧<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge">原创 2020-06-21 19:54:11 · 497 阅读 · 0 评论 -
vue设置遮掩层禁止滚动
vue 遮罩层阻止默认滚动事件在写移动端页面的时候,弹出遮罩层后,我们仍然可以滚动页面。vue中提供 @touchmove.prevent 方法可以完美解决这个问题<div class="dialog" @touchmove.prevent ></div>可以给body添加overflow:hidden属性解决,但是还有值得一提的是,虽然touchmove不会动,但是鼠标使用滚动键还是会滚动...原创 2020-06-17 15:56:15 · 538 阅读 · 0 评论 -
vue插件的实现过程(install)以及vue.use()
值得学习的教程:添加链接描述原创 2020-06-17 11:38:31 · 786 阅读 · 0 评论 -
vue-router路由参数的传递
使用vue开发也有一段时间了,但是感觉对于vue的一些使用还是有点生疏,故特此记录一下, 防止自己的遗忘首先在vue实例中,存在两个路由参数: 一个this.$router, this.$route console.log(this.$router, this.$route);打印之后可以看到router:对应的是vuerouter的实例route :对应的所在组件的子路由(home)在VueRouter的 options 中包含了所有路由信息,常可以用在导航的时进行vfor循环,拿到对原创 2020-06-17 10:58:47 · 265 阅读 · 0 评论 -
vue 的生命周期理解
vue生命周期写的比较好的:添加链接描述1.beforeCreate:有关于事件初始化, 以及data数据的观测2.created3.beforeMount对象element的挂载4.mounted5.beforeDestroy对于组件的更新(组件销毁前,组件销毁后)6.destroyed下面详细描绘vue的生命周期<!DOCTYPE html><html lang="en"><head> <meta charset="原创 2020-06-16 21:59:54 · 106 阅读 · 0 评论 -
深入相应式变更原理
官网: 相应式变更原理var vm = new Vue({ data:{ a:1 }})// `vm.a` 是响应式的vm.b = 2// `vm.b` 是非响应式的对象: 可以使用vue.set(), 或者this.$set(), 来进行改变数组: 也可以使用set实现, 以及一些变异的数组方法来达到实现...原创 2020-06-15 22:19:27 · 129 阅读 · 0 评论 -
使用axios的进一步封装
import Vue from 'vue'import Oraxios from 'axios'// Vue.prototype.$axios=axiosexport default function axios(opt){ return new Promise((resolve, reject)=>{ const instance=Oraxios.create({ baseURL:'https://cnodejs.org/api/v1',原创 2020-06-15 17:58:01 · 167 阅读 · 0 评论 -
vue中插槽的使用
对于vue中插槽相比大家都不陌生, (有具名和非具名)非具名插槽直接在里面写入slot标签即可vue插槽官网主要的写法由于版本的变动主要可分为两种在具名插槽时, 可变成,使用 template, v-slot的形式(只有在默认没有名字的slot是, v-slot才能用在组件上) 可以缩写为’#'我还是比较喜欢第一种,感觉格式比较统一还有一个就是插槽的作用域, 比如在插槽中写了一些数据的属性,在组件引入时, 想调用插槽中的属性其中里面的’:data’,最好写成属性名一样.原创 2020-06-15 17:50:36 · 217 阅读 · 0 评论 -
router-link 与router-view
在Vue中这两者相互依存, router-link 对应 html 中的a 标签,但是与a 标签不同的是,跳转的时候并不会刷新页面,而router-view 相当于router-link的承载页面,用于展示router-link 的的内容官网router-link 的一些用法:props:to...原创 2020-06-15 11:36:10 · 5004 阅读 · 0 评论 -
Ajax的优缺点
这是一篇有关基础的面试相关问题首先ajax的流程AJAX既然是通过浏览器的内置对象XMLHttpRequest来处理异步请求的那我们先来了解下他又哪些方法和属性:注:写在这里的为必选参数或者经常用到的可选参数方法:一、open();解释:发送请求的页面在不刷新的情况能将参数传给一个服务器进行处理, 这个方法就是将这些个参数传送过去参数:1, method:用于指定请求的类型 “GET"或者"POST”2, url:用于请求的地址, 可相对可绝对3, asyncFlag:指定请求方式为同原创 2020-05-21 14:26:08 · 210 阅读 · 0 评论 -
qs 的使用(qs.parse, qs.stringify)
起因: 在一次项目练习中, 使用axios , post传递参数时, 发现传递错误,经人指点后, 知道是参数的格式错误, 需要使用qs.stringify将参数进行格式化的处理.let url='https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&tn=baidu&wd=axios&rqlang=cn&rsv_enter=1&rsv_dl=tb&rsv_btype=t&inputT=126.原创 2020-06-02 12:27:05 · 1824 阅读 · 0 评论 -
子组件的两种方式
通过 ref 来操作 data ,或者methods,通过 props 进行参数的传递原创 2020-03-21 10:10:38 · 232 阅读 · 0 评论 -
vue 视图不更新
参考 vue不更新原创 2019-12-26 21:28:26 · 161 阅读 · 0 评论 -
[vue报错]之Computed property "XXX" was assigned to but it has no setter.
首先定位可以知道的是:在使用computed的时候出现的问题:这里提示我们需要使用setter, 我也是一脸懵逼, 什么是setter, computed为什么需要setter, 和我有什么关系, 带着这个疑问我们打开vue 的官网,毕竟遇到问题, 先看官网文档我们发现: vue 关于 computed的说明明确一点的是, computed中, 可以设置两个属性, 一个get , 一...原创 2019-12-18 22:52:10 · 3277 阅读 · 2 评论 -
Vue的使用
注意:使用匿名函数使,this的指向的问题,可能会导致,一些问题的出错;mint UI 实现索引的导航;{ob: Observer}使用防抖;先设置一个clearTimeout()在开启一个setTimeout()\也可以使用axios自身的方法来进行终止;状态管理的使用;...原创 2019-12-07 16:55:39 · 81 阅读 · 0 评论 -
vuex登录状态的使用
首先:由于对Vuex还是不太熟悉,所以特此记录一下学习的过程,完成一次登录状态的过程;参考:uni-appvuex官网: https://vuex.vuejs.org/zh/guide/testing.html,vuex 的管理过程:流程:首页为未登录状态 => 进行登录 => 首页状态改变 => 退出应用再次进入仍然是已登录状态//store.js 进行状态设...原创 2019-12-07 16:54:34 · 604 阅读 · 0 评论 -
Vue @/v-on事件修饰符
https://www.cnblogs.com/tianshug/p/11813331.html原创 2019-12-07 16:53:45 · 337 阅读 · 0 评论 -
函数命名(总结中...)
get… set… is… update… do…invalidate… refresh… init… on… fuck… calc…pop… dpop… push… dpush… re… construct…原创 2019-11-06 18:28:45 · 138 阅读 · 0 评论 -
vue-router的使用心得
在实践过程中领悟的东西,才会记得更牢原创 2019-11-06 18:27:08 · 227 阅读 · 0 评论 -
Vue项目复盘02(总结)
对于Vue 沃想说的就是,还是需要多加的练习与思考实际的练习,才会有收获;技术栈: vue+ vuex +vue-router+ axios 为基本的脚手架的组件主要的技术难点: 组件 , 组件的通信 , 路由. 路由的跳转 , Ajax的数据通信以及数据的处理,难点; 如何构建一个组件,有效的,高效的;匿名函数与对象中的 属性: function(){ } 区别;...原创 2019-11-06 18:26:36 · 152 阅读 · 0 评论 -
回到顶部的一些见解
回到顶部,可以说是在小程序中最开始遇到的一个问题微信中 可以使用 wx.pageScrollTo, 设置好scrollTop=0 ,即可完成,但是其中也有一些小坑,故特此记录一下;wx.pageScrollTo({ scrollTop:0, duration:300, success:res=>console.log(res), fail:res=>console....原创 2019-11-05 21:53:16 · 115 阅读 · 0 评论 -
vue报错之Error in render: "TypeError: Cannot read property 'avatar_url' of undefined
Error in render: "TypeError: Cannot read property ‘avatar_url’ of undefinedorError in render: "TypeError: Cannot read property xxx of undefined这是最近项目上遇到的问题,主要在遍历数据的时候, 出现的原因: 此时的写在template 中的数据为...原创 2019-10-31 12:12:23 · 1637 阅读 · 0 评论 -
vue 报错之Cannot assign to read only property 'exports' of object
vue 报错,原因: 使用module.exports={ …},致使出现报错根本原因: 无法同时使用 import 与 module.exports解决方案:使用其中一种即可, 两者不要同时混用, 这是一个不好的习惯;对babel.config.js 进行配置, 解决冲突;添加如图的一行:sourceType: 'unambiguous'参考:https://www.ji...原创 2019-10-29 22:52:54 · 360 阅读 · 0 评论 -
vue 有关于命名大小写的问题
记录一下命名的的一些坑组件命名的大小写组件名大小写定义组件名的方式有两种:使用 kebab-caseVue.component('my-component-name', { /* ... */ })当使用 kebab-case (短横线分隔命名) 定义一个组件时,也必须在引用这个自定义元素时使用 kebab-case,例如<my-component-name>。使...原创 2019-10-29 00:02:26 · 5097 阅读 · 15 评论 -
Vue 中npm install 的一些问题
在使用vue-cli 时,我们经常会使用npm命名去安装有些我们需要的插件但是有时会出现一些问题, 故特此记录一下;npm install xx --参数这其中可以做一些简写:npm install <=> npm i --save <=> -S --save-dev <=> -D 其中 --save 对应的为de...原创 2019-10-28 23:17:57 · 307 阅读 · 0 评论 -
vue的UI框架
PC端:Element官网地址:官网介绍:element ui框架的按钮组件,这款由饿了么前端开源的UI框架,一经面世,就收获大量程序员的芳心。在github 上更是高达29.8k的star早已说明一切。用于开发PC端的页面还是绰绰有余的。如果说你是用vue开发者,却没用过element UI,那你肯定不是合格的vue开发者。:iview官网地址:官网介绍:iView 是一套基...转载 2019-10-28 19:24:07 · 522 阅读 · 0 评论 -
vue的组件一些注意事项(props, 自定义事件)
vue 的核心,就是一个一个的组件;对于组件在使用上还是有一些需要的注意的东西的使用Vue.component(" ",{})这样注册的组件为全局注册组件;Props的使用, 大小写的问题对于传递一个对象的所有属性, 可以只使用v-bind=" "对于自定义事件, 禁止使用驼峰命名;使用中划线即可对于自定义事件, 如果需要将原生的事件绑定到组件上时,需要添...原创 2019-10-28 17:58:13 · 673 阅读 · 0 评论 -
vue之事件绑定加不加括号
学了一段时间的小程序,有重新回过头来学习vue,突然对时间绑定加不加括号有些疑问;经过测试,不加括号也是可以的,但是在如果需要传递参数的时候还是有一些区别,如果没有加括号, 默认传递参数为 MouseEvent,如果加了括号,则需要在括号中使用$event, 才能获取到MouseEvent...原创 2019-10-28 16:55:35 · 849 阅读 · 0 评论 -
vue相关文档整理
前言: 方便自己查看, 快速查找文档VUE 相关vue.jsvue-routervuexaxiosvue-lazyLoadbetter-scrollElementUImintUI小程序文档指南vant组件库原创 2019-10-28 16:19:11 · 152 阅读 · 0 评论 -
import 与 require 使用区别(以及路由懒加载)
这里指的是JS 中的使用, 虽然其他的语言也有引入的,(如Python)首先: 两者 的区别就是 :import 是 ES6 中利用模块化,而使用的而 require ,早一些,在node 中ADM 的引入方式;两者的功能是相同的, 只是使用方式上有一些细微的差别,需要注意下;require是赋值过程,其实require的结果就是对象、数字、字符串、函数等,再把require的结果...原创 2019-10-23 22:54:49 · 1940 阅读 · 0 评论