Vue.js
关注
分享
扫一扫
Pandora_417
以码为梦，不负韶华
展开
-
vue常见面试题
优化性能：使用keep-alive使用异步组件图片懒加载vue常见面试题如不销毁可能回会造成内存泄漏响应式原理定义响应式指的是组件 data 的数据一旦变化，立刻触发视图的更新。它是实现数据驱动视图的第一步。Vue 面试必问：响应式原理是什么以及是如何实现的...原创 2021-12-13 11:57:55 · 910 阅读 · 0 评论 -
vuex和vue-router
原创 2021-12-13 10:05:20 · 207 阅读 · 0 评论 -
Vue基础知识点
六个vue的面试题深度监听：handler和deep：truewatch的值如果是引用类型，拿不到oldVal。因为指针相同，此时的指针已经指向了新的值解决方案：使用computed监听通过深拷贝缓存旧值。深拷贝算法比序列化和反序列化（JSON.parse(JSON.stringify)要快，要好// 深拷贝算法function isArray(value) { return Object.prototype.toString.call(value) === '[object Arr原创 2021-12-12 17:18:51 · 847 阅读 · 1 评论 -
关于新手指导IntroJS，vue项目（vue3）和react项目（ant-design）的引用
安装插件npm i introJs 一、vue3项目中引用intro作新手引导src/utils/util.js文件import introJs from 'intro.js'/** * @name: 新手指导 * @param {String} pathname 当前页面的path * @param {Array} stepsArr 步骤内容（包括element、intro） * @return {*} */export function guide (pathname, ste原创 2021-08-24 09:45:25 · 1472 阅读 · 0 评论 -
03——深入学习vue
动态组件 （keep-alive）处理边界情况（父子组件传值）混入（mixin）自定义指令（directive）渲染函数（render） & JSX（babel插件） & 函数式组件过滤器（{{ message | filterA(‘arg1’, arg2) }}）2020-10-09，粗略的写个目录吧，以后有空再详细总结...原创 2020-10-09 20:05:16 · 225 阅读 · 0 评论 -
Vuex——复习
vuex实现数据共享把数组存到vuex的state中，并用localStorage长期缓存vue企业级电商系统(vuex)vuex详解原创 2020-09-28 16:11:11 · 167 阅读 · 0 评论 -
03.vue学习——过渡 & 动画（2020-09-13）
实例：<div id="demo"> <button v-on:click="show = !show"> Toggle </button> <transition name="fade"> <p v-if="show">hello</p> </transition></div>```new Vue({ el: '#demo', data: { show: t原创 2020-09-13 18:09:42 · 308 阅读 · 0 评论 -
02.vue学习——深入了解组件（2020-09-13）
组件名大小写定义组件名的方式有两种：当使用 kebab-case (短横线分隔命名) 定义一个组件时，你也必须在引用这个自定义元素时使用 kebab-case，例如 <my-component-name>。当使用 PascalCase (首字母大写命名) 定义一个组件时，你在引用这个自定义元素时两种命名法都可以使用。也就是说 <my-component-name> 和 <MyComponentName> 都是可接受的。注意，尽管如此，直接在 DOM (即非字符串的原创 2020-09-13 17:05:47 · 253 阅读 · 0 评论 -
01.vue复习——基础（2020-09-13）
1、组件Vue 组件提供了纯自定义元素所不具备的一些重要功能，最突出的是跨组件数据流、自定义事件通信以及构建工具集成。2、生命周期3、动态参数4、修饰符5、计算属性 computed6、侦听属性 watchVue 提供了一种更通用的方式来观察和响应 Vue 实例上的数据变动：侦听属性。当你有一些数据需要随着其它数据变动而变动时，但我们很容易滥用 watch7、动态绑定class与style<div class="static" v-bind:class="原创 2020-09-13 14:28:38 · 326 阅读 · 0 评论 -
elemen Ui +vue 上传 & 下载文件
上传文件参考官网Upload上传：https://element.eleme.cn/#/zh-CN/component/upload在这里本来是有个input框来放文件路径的，但是upload也会自动生成一个，于是我就在点击带slot=“trigger的i标签的同时设置input框不显示，并用upload自带的input覆盖掉1、action的属性值是文件上传的地址this.fileUrl=this.$path+"event/upload_attach/"，写在created（）里面；2、li原创 2020-09-12 11:34:21 · 420 阅读 · 0 评论 -
element UI 表单的使用
新增表格数据自然是通过表单来新增的咯~官网Form表单链接:https://element.eleme.cn/#/zh-CN/component/form这里就不贴代码了，官网也差不多都有，就简述一下这次所用所涉及的参数。1.在 Form 组件中，每一个表单域由一个 Form-Item 组件构成，表单域中可以放置各种类型的表单控件，包括 Input、Select、Checkbox、Radio、Switch、DatePicker、TimePicker。2.W3C 标准中有如下规定：当一个 for.原创 2020-09-12 10:45:36 · 549 阅读 · 0 评论 -
获取表格数据
getAllTheme(){ this.loading = true this.$fetch(this.$path + "archive/HealthView/", this.search_form).then(res => { this.loading = false if(res.code==200){ this.table_data = res.data原创 2020-09-12 10:30:59 · 239 阅读 · 0 评论 -
Element UI + Vue 表格的显示
官网参考地址关于el-table的一些参数1、当el-table元素中注入data对象数组后，在el-table-column中用prop属性来对应对象中的键名即可填入数据，用label属性来定义表格的列名。可以使用width属性来定义列宽。2、border 有边框3、max-height：设置最大高度，当超过这个宽度时，就会出现滑动条（Slider）4、loading：可设置默认值初始为false，然后在create（）方法里面，赋值为true，这样子的话，表格就会在页面一有数据就立马加载出来原创 2020-09-12 10:15:56 · 558 阅读 · 0 评论 -
vue--ios手机input点击手机输入键盘顶起页面解决方案
<input type="text" placeholder="请填写手机号" maxlength="11" v-model="phone" @focus="getFocus" />getFocus() { $("input").on("blur", function() { window.scroll(0, 0); });},原创 2019-08-01 09:01:37 · 1020 阅读 · 0 评论 -
如何遍历json数据生成三维数组
如何遍历json数据生成三维数组，及删选再生成三维数组原创 2019-08-27 15:16:13 · 1525 阅读 · 0 评论 -
Vue.js环境搭建
windows系统下安装教程NPM方法在用Vue.js构建大型应用的时候推荐使用NPM安装方法，NPM能很好的和诸如Webpack或者Browserify 模块打包器配合使用。Vue.js 也提供配套工具来开发单文件组件。首先，先列出我们接下来需要的东西：1、node.js环境（npm包管理器）2、vue-cli 脚手架构建工具3、cnpm npm的淘宝镜像1） 安装node.js...原创 2019-03-16 16:46:40 · 226 阅读 · 0 评论 -
Vue.js --02 常识
什么是Vue.jsVue.js 是目前最火的一个前端框架，React是最流行的一个前端框架（React除了开发网站，还可以开发手机App， Vue语法也是可以用于进行手机App开发的，需要借助于Weex）Vue.js 是前端的主流框架之一，和Angular.js、React.js 一起，并成为前端三大主流框架！Vue.js 是一套构建用户界面的框架，只关注视图层，它不仅易于上手，...原创 2019-05-04 17:04:40 · 128 阅读 · 0 评论 -
第一个vue.js实例--03
第一个vue.js实例 <html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <!-- 1. 导入Vue的包 --> <script src="../../jQuery库/vue-2.4.0.js"><...原创 2019-05-04 17:37:25 · 165 阅读 · 0 评论 -
v-cloak,v-text,v-html，v-on的基本使用--04
v-cloak,v-text,v-html的基本使用v-cloak：可解决 插值表达式闪烁的问题（还要在style样式表中设计display：none；）v-text：默认 不闪烁 （但v-text会覆盖元素中原本的内容，）v-html：使msg内容中的HTML标签具有意义，而不会显示出来<!DOCTYPE html><html lang="en"><he...原创 2019-05-04 21:37:25 · 178 阅读 · 0 评论 -
vue之跑马灯
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>跑马灯</title> <script src="../../jQuery库/vue-2.4.0.js"></script></head>&...原创 2019-05-08 09:32:57 · 515 阅读 · 0 评论 -
vue之事件修饰符.stop.prevent.self .once.capture
事件修饰符：.stop 阻止冒泡.prevent 阻止默认事件（例如a标签的跳转事件可阻止）.self 只当事件在该元素本身（比如不是子元素）触发时触发回调（使用 .self 实现只有点击当前元素时候，才会触发事件处理函数，限制死了）.once 事件只触发一次（比如a标签跳转只能转一次）.capture 添加事件侦听器...原创 2019-05-08 10:06:11 · 491 阅读 · 0 评论 -
Vue之v-model 指令 数据的双向数据绑定
v-model 指令，可以实现 表单元素和 Model 中数据的双向数据绑定注意： v-model 只能运用在 表单元素中 <div id="app"> <h4>{{ msg }}</h4> <!-- v-bind 只能实现数据的单向绑定，从 M 自动绑定到 V， 无法实现数据的双向绑定 --> <!-- &l...原创 2019-05-08 10:12:39 · 446 阅读 · 0 评论 -
vue 之简易计算器
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>计算器</title> <script src="../../jQuery库/vue-2.4.0.js"></script></head>&l...原创 2019-05-08 11:18:37 · 351 阅读 · 0 评论 -
关于v-for的坑——新手入门
1、这里要这么用，因为它是数组，倘若不遍历输出的话，那么，最后v-for引用的时候，只会输出最后一个value。还有这里也是，v-for循环的时候，遍历输出即可。不过要注意的是属性引用的时候，属性前加冒号：绑定，也不用{{}}，其余的用"+"拼接符连接。 <li role="presentation" class="dropdown-header city-letter" :id="...原创 2019-08-14 14:12:43 · 420 阅读 · 0 评论 -
vue中如何在v-for中动态的使用将index拼接字符串后绑定id属性
这个问题困惑了一会，直接拼接加字符串的话会报错，若添加数字的话，则会相加。所以这样写就好了绑定ID是的时候这样写：id=" 'person_'+ index" 的形式，注意person_必须用双引号引起来...原创 2019-08-15 09:34:09 · 2357 阅读 · 0 评论 -
数组中出现__ob__: Observer无法取值，及批量出现getter&setter的情况
将返回的数据data先转换为JSON字符串形式，然后再从字符串形式转换成JSON格式JSON.parse(JSON.stringify(data))。但还有一些其他问题 vue的原型是object，于是就在ajax里在引一层数据，最后传给vue里面的data好了。关键代码如下 var vue = new Vue({ el: "#app", ...原创 2019-08-16 15:14:42 · 1918 阅读 · 0 评论 -
VUE 学习路线
先去看完ES6再去学VUE会容易十分多阮一峰《ECMAScript6》Module；刷vue的官方文档（前期），期直接用script标签引入js跟着官网写基础demo就好。看完一遍文档对组件概念依然不清晰是没关系的，这个得靠实战视频去理解。生命周期的图片保存下来，慢慢理解。官方文档刷完基础的部分就可以先停下来去看实战视频。（即官网的VUE生态系统可以先放着不看，刷完视频后再去看），初级入门 ...原创 2019-08-22 09:54:48 · 256 阅读 · 0 评论 -
Vue2.0学习文档--05
一、引入<script src="http://cdn.bootcss.com/vue/2.3.4/vue.js"></script><script src="https://unpkg.com/vue"></script>二、简单指令1、起步文本插值<div id="app"> {{message}}</di...原创 2019-08-22 10:39:44 · 175 阅读 · 0 评论 -
Vue2.x核心技术----手记01
一、Vue2.x常用知识点（模板语法、条件渲染、列表渲染等）二、Vue2.x的核心技术三、集成Vue2.x原创 2019-03-19 17:09:53 · 164 阅读 · 0 评论