文章 2022-05-05 来自:开发者社区

Vue数据双向绑定原理(vue2向vue3的过渡)

一、vue21、认识definePropertyvue2中的双向绑定是基于defineProperty的get操作与set操作,那么我们简单认识下defineProperty,作用: 就是直接在一个对象上定义一个新属性,或者修改一个已经存在的属性。 那么我们先来看下Object.getOwnPropertyDescriptor(),有定义方法就会有获取方法,对这就是与defineProperty....

文章 2022-05-03 来自:开发者社区

vue展示json数据,vue-json-viewer的使用

安装$ npm install vue-json-viewer --save引入//引入 import JsonViewer from 'vue-json-viewer' // 注册 components: { JsonViewer, },也可以 import Vue from 'vue' import JsonViewer from 'vue-json-viewer' ...

vue展示json数据,vue-json-viewer的使用
文章 2022-04-27 来自:开发者社区

Vue数据双向绑定原理(vue2向vue3的过渡)

众所周知,Vue的两大重要概念:数据驱动组件系统接下来我们浅析数据双向绑定的原理一、vue21、认识definePropertyvue2中的双向绑定是基于defineProperty的get操作与set操作,那么我们简单认识下defineProperty,作用: 就是直接在一个对象上定义一个新属性,或者修改一个已经存在的属性。 那么我们先来看下Object.getOwnPropertyDescr....

Vue数据双向绑定原理(vue2向vue3的过渡)
文章 2022-04-26 来自:开发者社区

Vue项目数据动态过滤实践

这个问题是在下在做一个Vue项目中遇到的实际场景,这里记录一下我遇到问题之后的思考和最后怎么解决的(老年程序员记性不好 -。-),过程中会涉及到一些Vue源码的概念比如 $mount、render watcher 等,如果不太了解的话可以瞅瞅 Vue源码阅读系列文章 ~问题是这样的:页面从后台拿到的数据是由 0、1 之类的key,而这个key代表的value比如 0-女、1-男 的对应关系是要从....

Vue项目数据动态过滤实践
文章 2022-04-26 来自:开发者社区

组件库实战 | 用vue3+ts实现全局Header和列表数据渲染ColumnList

️序言最近在用 vue3 和 ts 捣鼓一些小工具,发现平常开发中一个很常见的需求就是,数据列表的渲染。现在重新学习,发现我在学 vue2 时的很多设计规范和逻辑都考虑的不是特别妥当。因此,写下这篇文章,记录组件设计中数据列表渲染和全局头部的设计。一起来学习吧~一、ColumnList列表数据渲染1、设计稿抢先知在了解功能实现之前,我们先来看看原型图,看我们想要实现的数据列表是怎么样的。如下图所....

组件库实战 | 用vue3+ts实现全局Header和列表数据渲染ColumnList
文章 2022-04-26 来自:开发者社区

手把手教你剖析vue响应式原理,监听数据不再迷茫

️前言这是我参与更文挑战的第27天,活动详情查看:更文挑战近期在对 vue 的学习到一定阶段之后,在想着自己能不能造些东西。于是身边的小伙伴建议说可以从看 vue 的源码开始,毫无头绪的我原本迟迟不敢迈出这一步……(内心经历了各种自我劝说后)最终,开启了我的源码学习之路。于是我搜刮了一些常见的原理来进行学习,我对 vue 源码的第一步从 vue 的响应式原理开始。下面的这篇文章中,将记录我学习 ....

手把手教你剖析vue响应式原理,监听数据不再迷茫
文章 2022-04-23 来自:开发者社区

一篇文章教会你创建vue项目和使用vue.js实现数据增删改查

【一、项目背景】在管理员的一些后台页面里,数据列表中都会对这些数据进行增删改查的操作,例如管理员添加商品、修改商品价格、删除商品、查询商品,我们应该关注这些数据的操作和处理。【二、项目目标】主要有以下5个目标:1、如何创建vue项目。2、数据添加方法:获取到id和name在data上面获取,组织一个对象,把对象通过数组的相关方法,添加到当前data的自定义的一个数组,在VM使用Model数据操作....

一篇文章教会你创建vue项目和使用vue.js实现数据增删改查
文章 2022-03-13 来自:开发者社区

Vue使用mock数据几种方式

Vue项目使用mock数据的几种方式本文是基于vue/cli 3.0创建的项目进行讲解首先我们来说一说vue/cli 3.0 与 2.0 的一些不同:3.0 移除了 static 文件目录,新增了 public 目录,这个目录下的静态资源不会经过 webpack 的处理,会被直接拷贝,所以我们能够直接访问到该目录下的资源,静态数据(如json数据、图片等)需要存放在这里。放在public目录下的....

文章 2022-03-08 来自:开发者社区

如何在 Vue 中使用 Chart.js - 手把手教你搭可视化数据图表

本文首发:《如何在 Vue 中使用 Chart.js - 手把手教你搭可视化数据图表》很多 Vue 项目中都需要 PDF 文件预览功能,比如合同 ERP,销售CRM,内部文档CMS管理系统,内置 PDF 文件在线预览功能。本文手把手教你搭建一套 PDF 预览组件嵌入到 Vue 项目中,实现 PDF 文件在线预览等 PDF 预览的所有常见功能。跟随本教程学习完成后,你会搭出以下 PDF 在线预览效....

文章 2022-02-26 来自:开发者社区

如何在 Vue 中使用 Chart.js - 手把手教你搭可视化数据图表

本文首发:《如何在 Vue 中使用 Chart.js - 手把手教你搭可视化数据图表》使用 Chart.js 在 Vue 搭建的后台管理工具里添加炫酷的图表,是所有数据展示类后台必备的功能,本教程手把手教大家如何在 Vue 中加入 Chart.js ,一个基于 JavaScript 的开源可视化图表库,Chart.js 涵盖了常见的数据图表类型。当然,如果你...

本页面内关键词为智能算法引擎基于机器学习所生成,如有任何问题,可在页面下方点击"联系我们"与我们沟通。

阿里巴巴终端技术

阿里巴巴终端技术最新内容汇聚在此,由阿里巴巴终端委员会官方运营。阿里巴巴终端委员会是阿里集团面向前端、客户端的虚拟技术组织。我们的愿景是着眼用户体验前沿、技术创新引领业界,将面向未来,制定技术策略和目标并落地执行,推动终端技术发展,帮助工程师成长,打造顶级的终端体验。同时我们运营着阿里巴巴终端域的官方公众号:阿里巴巴终端技术,欢迎关注。

+关注