Vue3
文章平均质量分 82
ytllll
新时代农名工
展开
-
数据可视化Echarts
什么是数据可视化?数据可视化:为了清晰有效地传递信息,数据可视化使用统计图形、图表、信息图表和其他工具;可以使用点、线或条,对数字数据进行编码;数据可视化让我们可以更加清晰的去认识、理解、表达数据;前端可视化工具前端进行数据可视化的工具非常多常见的框架:Echarts、g2、d3、vis、hightChar等等;g2框架封装:bizcharts(react)viser(vue);地理可视化:g2、L7、高德的Loca、菜鸟的 鸟图;3D可视化:three.js目前使原创 2021-11-15 17:33:10 · 1212 阅读 · 0 评论 -
Vite的基本使用
认识Vite什么是Vite?官方的定位:下一代前端开发与构建工具Vite是一种新型前端构建工具,能够显著提升前端开发体验。Vite的构造它由两部分组成:一个开发服务器,它基于原生ES模块提供了丰富的内建功能,HMR的速度非常快。一套构建指令,它使用rollup打开我们的代码,并且它是预配置的,可以输出生成环境的优化过的静态资源。Vite的安装和使用Vite要求Node版本大于12的npm install vite -D通过vite来启动项目: npx viteVite可以直原创 2021-07-06 16:41:22 · 3321 阅读 · 0 评论 -
对象的引用-浅拷贝和深拷贝
1. 对象的引用赋值 //对象是引用类型(引用在c/c++中其实就是指针的意思) const info = {name:'ytlll',age:18} const obj = info info.name = "ytl" console.log(obj.name); //ytl假设info的对象指向的是0x100的内存地址,该内存地址中保存的是name和age两个属性创建obj = info 其实是把info的内存地址0x100 赋值给obj所以obj所指向原创 2021-06-14 17:22:32 · 132 阅读 · 0 评论 -
侦听器watch
侦听器的基本使用*官方文档:https://v3.cn.vuejs.org/api/instance-methods.html#watch什么是侦听器?开发中我们data返回的对象中定义了数据,这个数据通过插值语法等方式绑定到template中。当数据变化时,template会自动进行更新来显示最新的数据。但是在某些情况下,我们希望代码逻辑中监听某个数据的变化,这个时候就需要侦听器watch来完成。侦听器的用法:选项 : watch类型 :{[key:string]:strin原创 2021-06-14 17:22:00 · 158 阅读 · 0 评论 -
v-for中key的作用
在使用v-for进行列表渲染时,通常会给元素或者组件绑定一个key属性。官方的解释:key属性主要用在Vue的虚拟DOM算法,在新旧nodes对比时辨识VNodes;如果不使用key,Vue会使用一种最大限度减少动态元素并且尽可能的尝试就地修改/复用相同类型元素的算法;而使用key时,它会基于key的变化重新排列元素顺序,并且会移除/销毁key不存在的元素;1. 插入F的案例这个案例是当我点击按钮时会在中间插入一个f<template id="my-app..原创 2021-06-14 17:20:16 · 424 阅读 · 0 评论 -
v-bind指令
v-bindv-bind指令:作用:动态绑定属性缩写:: (语法糖,就是一个冒号:)预期:any (with argument) | Object (without argument)参数:attrOrProp (optional)v-bind用于绑定一个或多个属性值,或者向另一个组件传递props值在开发中,有许多属性需要动态进行绑定的:比如图片的链接src、网站的链接href、动态绑定一些类、样式等等 <div id="app"> </div&原创 2021-06-14 22:04:31 · 268 阅读 · 0 评论 -
Vue3基本指令
1. Mustache双大括号语法数据显示到模板(template)中,使用最多的语法是**“Mustache”语法 (双大括号)**的文本插值。Mustache中不仅仅可以是data中的属性,也可以是一个JavaScript的表达式。 <template id="my-app"> <!-- 1.mustache的基本使用 --> <h2>{{message}}</h2> <!-- 2.也可以是一个表达式 -->原创 2021-06-14 21:44:32 · 552 阅读 · 3 评论 -
初识Vue3
1.Vue.js安装方式一:直接CDN引入<script src="https://unpkg.com/vue@next"></script>方式二:下载和引入下载Vue的源码,可以直接打开CDN的链接:通过script标签,引入刚才的文件: <script src="../js/vue.js"></script>2.Vue3的简单使用<body> <div id="app"></div>原创 2021-06-14 17:18:51 · 82 阅读 · 0 评论