logo
publist
写文章

简介

该用户还未填写简介

擅长的技术栈

可提供的服务

暂无可提供的服务

双向数据绑定原理 vue2.0 与 vue3.0

目前3.0已经发布了,自己也尝试在2的基础上升级3版本项目,发现3确实变了好多,例如钩子函数就大量减少了。那么原理也是有变化的用过vue的人都知道 vue2.x实现双向数据绑定的原理是利用Object.defineProperty() 这个方法重新定义了对象获取属性值(get)和设置属性值(set)的操作来实现的,当数据发生改变发出通知。在MDN上对该方法的说明是:Object.definePro

利用computed计算属性写购物车商品计算价格 (会用到数组的方法reduce做聚合操作)

<div id="app"><h1>购物车</h1><input type="checkbox" v-model="checkedAll" />全选<ul><li v-for="product in products"><input type="checkbox" v-model="product.checked" /&

封装 element el-date-picker时间选择区间

效果: 1 大于当前时间的以后日期禁选。2 选中时间的前后七天可选 (最多可查询7天数据)3。基于el-date-picker 处理满足项目需求。

文章图片
#vue.js#elementui#javascript
vue项目使用cookie、localStorage和sessionStorage进行储存数据

一,cookie的使用1,首先加载模块npm i js-cookie -S2,在使用cookie的页面上进行引入import Cookies from ‘js-cookie’3,使用方法1 创建一个在整个网站上有效的CookieCookies.set(‘name’, ‘value’);2 创建一个从现在起7天后过期的cookie,在整个站点上有效:Cookies.set(‘name’, ‘valu

#html5#vue.js#javascript
vue3 祖孙组件通讯传值 provide 与 inject 以及 响应式数据的判断

父组件有一个provide 选项来提供数据,子组件有一个inject 选项来开始使用这些数据写法:1 在祖组件中 写入 provide(‘传递的变量名’,自定义变量名)2 在孙组件中写入inject(‘接收的传递的变量名’)代码演示记得导入 provide祖组件文件中孙组件文件 接收 inject效果响应性数据的传递与接收。要先在祖组件中 provide 数据出去,在孙组件拿到的也是响应式的,并且

#vue.js#前端#javascript
vue底部导航栏(选中状态刷新不消失)解决

我们用Vue写手机端的项目,经常会写底部导航栏,我这里总结一套比较方便实用的底部导航栏方法,并且可以解决浏览器刷新选中状态消失的问题。也可以选择自适应屏幕。看一下效果,底部的图标是我自己找的,选中和未选中样式的图片,根据公司要求,你也可能会用fontsize去写。(全部代码黏贴到本文的最后面了)关于布局的已经写过了,在这个博客文件中.当然还有新的方法去写导航首先在导航页面中的data()里边定义一

#vue.js#javascript#前端
vue 点击按钮改变颜色

代码如下:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>vue空白模板</title&g

#vue.js#javascript#前端
vant 组件引入报组件注册错误,<van-contact-card> - did you register the component correctly? For recursive c,解决

你看你是不是也是这样的错误vue.runtime.esm.js?2b0e:619 [Vue warn]: Unknown custom element:- did you register the component correctly? For recursive components, make sure to provide the “name” option.我们按需引入了,明明按照官网上

#c语言#vue.js#前端
Vue的两种路由模式 和 History模式怎么配置

**Vue有两种路由模式:hash,history**(1)hash模式通过监听路由的变化实现,如下代码.路由中带着#,变化的也都是#后面的值window.onhashchange = function(event) {console.log(event.oldURL, event.newURL);let hash = loaction.hash//通过location对象来获取hash地址con

#vue.js#nginx#javascript
    共 36 条
  • 1
  • 2
  • 3
  • 4
  • 请选择