vue
qq_37820215
这个作者很懒,什么都没留下…
展开
-
vue react的区别
react和vue都是做组件化的,整体的功能都类似,但是他们的设计思路是有很多不同的。使用react和vue,主要是理解他们的设计思路的不同。1.数据是不是可变的react整体是函数式的思想,把组件设计成纯组件,状态和逻辑通过参数传入,所以在react中,是单向数据流,推崇结合immutable来实现数据不可变。而vue的思想是响应式的,也就是基于是数据可变的,通过对每一个属性建立Watcher来监听,当属性变化的时候,响应式的更新对应的虚拟dom。总之,react的性能优化需要手动去做,而原创 2020-09-14 14:19:11 · 135 阅读 · 0 评论 -
vue补充
该项目是一个购物商城的移动 app,采用 VUE 框架构建单页面应用,实现购物商店的基本操作,如浏览商品种类及商品的详细信息等功能。 使用 vue 框架,vue-router 搭建项目路由,vuex 实现各组件数据的共享。 根据业务逻辑,划分组件,结合 vue 第三方插件(Swiper插件),ES6 语法、HTML5、CSS3 完成页面设计及布局实现。 采用组件化思想搭建项目,增加代码的复用性,从而提高开发效率,合理使用钩子函数,实现数据的监听。 通过 better-scroll、vue-原创 2020-06-29 09:29:05 · 146 阅读 · 0 评论 -
vue 的一些原理
一、watch大致过程具体过程为需要观察的数据创建并收集watcher(依赖),当数据改变时通知到watcher将新值和旧值传递给用户自己定义的回调函数(handler)。二、computed为什么计算属性有缓存功能?因为当计算属性经过计算后,内部的标志位会表明已经计算过了,再次访问时会直接读取计算后的值;为什么计算属性内的响应式数据发生变更后,计算属性会重新计算?因为内部的响应式数据会收集computed-watcher,变更后通知计算属性要进行计算,也会通知页面重新渲染,渲染时会读.原创 2020-09-11 21:04:47 · 111 阅读 · 0 评论 -
vue 响应式原理
Dep.target 全局变量指向的就是当前正在解析指令的Complie生成的 WatcherCompile是HTML指令解析器,对每个元素节点的指令进行扫描和解析,根据指令模板替换数据,以及绑定相应的更新函数,生成初始Watcher。详解Vue响应式原理Vue源码解读之Dep,Observer和Watcher...原创 2020-09-03 12:40:56 · 118 阅读 · 0 评论 -
虚拟dom总结
一、三个过程用JavaScript模拟DOM树,并渲染这个DOM树 比较新老DOM树,得到比较的差异对象-----diff 把差异对象应用到渲染的DOM树。------patch(打补丁)先利用diff找到差异对象,再对其进行patch,就是创建新节点、移除等操作。有一个问题:那个老dom树就是真实dom树吗,对其patch就是对真dom树直接进行操作吗?我觉得是的浅析虚拟dom原理并实现详解Vue中的虚拟DOMVue.js通过编译将template 模板转换成渲染函数(rende原创 2020-08-27 18:18:12 · 242 阅读 · 0 评论 -
vue问题
Vue报错Custom elements in iteration require 'v-bind:key' directives."错误解决https://blog.csdn.net/weixin_41996632/article/details/89338501怎样忽略vue-cli中的警告Unexpected tab character,Mixed spaces and tabs,...原创 2020-01-18 21:18:22 · 136 阅读 · 0 评论 -
vue 饿了么ui 日期选择器 修改样式
<div class="block"> <el-date-picker v-model="selectStartTime" type="date" placeholder="开始日期" :pi...原创 2019-07-22 16:55:44 · 3889 阅读 · 1 评论 -
vue的el-table表格 点击添加要素 出现一个新的div
<div class="main" > <el-table :data="details" style="width:100%;"> <el-table-column v-if="false" prop="id" ...原创 2019-07-22 16:34:44 · 3586 阅读 · 0 评论 -
vue 根据不同的情况选择不同的css样式
<div v-bind:class="classObject"></div>js部分export default{ data () { return { classObject:[{ 'classA':true,'classB':false,'classC':false,'classD':false,'classE':...原创 2019-07-22 16:23:51 · 8125 阅读 · 3 评论 -
vue 父组件向子组件传值
父页面<template>部分 <BuoyMessage v-bind:message="messageData">状态</BuoyMessage><script>部分import BuoyMessage from './BuoyMessage.vue'export default{ data(){}, ...原创 2019-07-22 16:14:47 · 132 阅读 · 0 评论 -
vue 绑定值
vue双向绑定值v-model="item.dev"vue单向绑定值:value="item.dev"原创 2019-07-22 15:53:26 · 681 阅读 · 0 评论 -
vue table中点击一行tr,使其高亮
<template>部分<tr v-for="(item,index) in message" :key="index" @click="showDeviceByDiv($event,index)" :class="{active: activeName == index}" ><td >{{item.dev}}</td></tr&g...原创 2019-07-22 15:50:16 · 1422 阅读 · 1 评论 -
vue 引入图片时报错
在用cesuim绘制 billboard (图片)时报错viewer.entities.add({ id : deviceData[i].dev, name : deviceData[i].dev_name, position : Cesium.Cartesian3.fromDegrees(Number(de...原创 2019-07-22 15:38:30 · 1123 阅读 · 0 评论 -
vue 兄弟组件之间进行传值
a页面传值(message)给b页面a页面:方法名(){ Bus.$emit("hiddenMessage",meaage)//message就是我们要传的值}b页面 hiddenBbtn(){ Bus.$on("hiddenMessage",(message)=>{ //对message进行操作 ...原创 2019-07-22 15:29:16 · 165 阅读 · 0 评论