Reactive 第11页

vue3 transition用法详解

一、CSS过渡class对想要添加动画效果外层加上,组件传一个nameprop来声明一个过渡效果名切换import{ref,reactive}from"vue";constsh

小钱999·2023-11-29 12:07

总结Vue3里一些常见的组合式api

一：前言二：常见api1、ref和reactive这两个组合式api是在Vue3开发中最为常见的两个api，主要是将一个非响应式的数据变为响应式数据。

暴怒的代码·2023-11-29 12:00

vue3如何使用ref(表单验证为例)

所以需要导入使用，方法如下：.js文件中定义数据和方法//导入import{reactive,ref}from"vue";//定义表单绑定的refexportconstloginForm=ref(null

Lora_0925·2023-11-29 10:47

Element plus 表单验证嵌套数组

在网上找到的都是以前版本的或者不能用的，现在整理一下可用的//元素排列根据文档显示嵌套的字段prop应为字符串数组//form字段constform=reactive({id:1,....split:[

番茄蛋饭25块半·2023-11-29 02:57

vue3 element plus 表单验证数组嵌套对象格式验证动态验证等

基本结构model表单数据对象rules验证对象propmodel的键名提交import{reactive,ref}from"vue";importtype{FormInstance,FormRules

潇、然·2023-11-29 02:55

vue3中的增删改查，全反选

vue3写购物车（1）首先了解一些属于vue3中的知识及写法1.使用import{}from‘vue’获取所有当前页面中所需要的数据或方法如import{ref,reactive,defineComponent

踟蹰·2023-11-28 16:23

vue3 增删改查

在页面里先导入api文件夹获取列表1.循环列表2.发请求//城市数据渲染constcitys=reactive([{name:"长沙",},{name:"株州",},{name:"湘潭",},{name

ZDM_9999·2023-11-28 16:52

TepeScript 问题记录

string;vc_id:string;model_url:string;preview_url:string;isPrivate:boolean;visible:boolean;}constformData=reactive

Raywh·2023-11-28 13:58

vue3 toRef

toRef作用语法案例toRefs作用创建一个ref对象，其value值指向另一个对象（reactive）中的某个属性。

摆烂波比·2023-11-28 12:14

Vue3中toRef函数与toRefs函数

toRefs函数接受一个响应式对象(reactive对象),其转换为一个包含每个属性的Ref对象的普通对象。

前端摸鱼侠·2023-11-28 12:13

Vue3中toRef的使用(彻底清楚搞懂toRef和toRefs是什么)

扩展：toRefs与toRef功能一致，但可以批量创建多个ref对象，语法：toRefs(person)例：首先我们知道为什么要用toRef和toRefs比如我们使用reactive来创建一个对象import

肖肖冲鸭·2023-11-28 12:43

Vue3中ref与toRef的区别

代码如下：姓名：{{name}}年龄：{{age}}薪资：{{salary}}K修改姓名修改年龄修改薪资import{ref,reactive,toRef,toRefs}from'vue'exportdefault

天才小熊猫点、·2023-11-28 12:38

[vue3学习Day1]创建、setup、ref、toRef、reactive

安装和创建1.安装node.js请在官网下载安装：https://nodejs.org/zh-cn/输入指令node-v能显示版本号，说明node已经装好了输入指令`npm-v能显示版本号，说明npm可以使用了2.配置默认安装目录和缓存日志目录说明：这里的环境配置主要配置的是npm安装的全局模块所在的路径，以及缓存cache的路径，之所以要配置，是因为以后在执行类似：npminstallexpre

MOAN.·2023-11-28 12:04

vue3中的动态component组件

/child2.vue'import{defineComponent,reactive,ref,shallowRef}fro

俊哥前端工程师·2023-11-28 12:34

Vue3 toRef

toRef可以用来为一个reactive对象的属性创建一个ref，这个ref可以被传递并且能够保持响应性。作用：创建一个ref对象，其value值指向另一个对象中的某个属性。

＊且听风吟·2023-11-28 12:34

vue3中shallowReactive与shallowRef

shallowReactive与shallowRefshallowReactive:只处理了对象内最外层属性的响应式(也就是浅响应式)shallowRef:只处理了value的响应式,不进行对象的reactive

俊哥前端工程师·2023-11-28 12:03

vue3如何判断是不是响应式数据

·isRef:检查一个值是否为一个ref对象·isReactive:检查一个对象是否是由reactive创建的响应式代理·isReadonly:检查一个对象是否是由readonly创建的只读代理·isProxy

俊哥前端工程师·2023-11-28 12:33

vue3封装element-plus的Table表格

vue3封装element-plus的Table表格#新建Table.vuesrc/components/Table.vueimport{reactive,useSlots,isProxy}from"vue

实习打字猿·2023-11-28 11:06

vue3 element-plus el-tree自定义图标

树组件{{scope.node.label}}import{onMounted,reactive}from"vue";import{getDept}from"@/api/asset"//定义派发事件constemit

随便叫个啥呢·2023-11-28 11:05

【踩坑笔记】vue3 element-plus el-input 无法输入问题

原因是el-form的v-model="loginForm"ref="loginForm"在vue3中值不能相同把ref去掉或者改名即可这是js的代码（对象记得用reactive，不然也会无法输入）import

soladuor·2023-11-28 11:34

vue 3.0 + TS form 表单封装

input封装//components/ValidateInput.vue{{inputRef.message}}import{defineComponent,reactive,PropType,onMounted

学而不化，非学也。·2023-11-28 08:05

Vue3+Ts的setup()函数的Prop、Emit、Computed、WatchEffect、Watch、Provide/Inject用法

一、Prop、EmitProp：通过Prop父组件向子组件传递数据Emit：通过Emit子组件向父组件传递数据父组件import{onMounted,ref,reactive,nextTick,toRefs

念你那丝微笑·2023-11-28 01:09

Vue3 实现elementPlus的table列宽调整和拖拽

1、需要的包//除了Vue和element-plus外还需要以下的包npminstallsortablejs2、具体代码如下，可直接粘贴运行import{nextTick,onMounted,reactive

小朱小先生·2023-11-28 00:10

使用vue3的函数式组件定义一个加载elementPlus的下拉框

定义import{createVNode,h,markRaw,reactive,resolveComponent,SetupContext,VNode}from'vue'//px方法用来增加px使用的interfaceStyleItemPropType

chendf_·2023-11-27 19:21

Spring Boot 2.0 新特性

内嵌容器包结构调整为了支持reactive使用场景，内嵌的容器包结构被重构了的幅度有点大。EmbeddedServletContainer被重命名为WebServer，并且org.spri

福尔摩帅·2023-11-27 06:30

Spring Boot实践——Spring Boot 2.0 新特性和发展方向

内嵌容器包结构调整为了支持reactive使用场景，内嵌的容器包结构被重构了的幅度有点大。EmbeddedServletContainer被重命名为WebServer，并且org.springfram

weixin_30532973·2023-11-27 06:00

Spring Boot 2.0 新特性和发展方向

内嵌容器包结构调整为了支持reactive使用场景，内嵌的容器包结构被重构了的幅度有点大。

迷途的小小·2023-11-27 06:28

前端技术使网页生成PDF预览并下载

import{createApp,reactive,toRefs}from"vue";importjsPDFfrom"jspdf";importhtml2Canvasfrom"html2canvas";

海阔天空BM·2023-11-27 04:59

给element plus中动态form-item增加校验的可行方法

校验规则的使用也如下：....constformModel=reactive({loginId:null})construles=reactive({loginId:[{required:true,message

三笑咖啡·2023-11-27 03:35

Swiper 应用Vue遇到问题处理记录

首先是在组件中引入common文件夹下不同语言下配置的共同的属性conststate=reactive({imgs:{btnIcon:tc('message.btnIcon'),}})使用图片图片展示出来

一个前端人·2023-11-26 04:09

获取数据Proxy下的Target的数据

获取数据时遇到Proxy包裹的数据解决1、使用toRawVue3.0给我们提供的新方法，toRaw方法是把被reactive或readonly后的Proxy对象转换为原来的target对象使用方法：constData

麻辣翅尖·2023-11-25 20:49

一文带你打通Vue3、TypeScript基础

文章目录创建项目创建项目Vue3与Vue2中的main.js的区别组合式API(compositionAPI)setup函数数据响应式---reactive函数以及ref函数计算属性computed函数监视属性

孜然香菜·2023-11-25 08:34

Vue3用法

文章目录Vue31.创建vue31.1使用vue-cli创建1.2使用vite创建(node版本>12.0.0.0)2.setup函数3.ref函数(修改数据需要.value)4.reactive函数(

ZT_KEBEI·2023-11-25 07:29

初学vue3与ts：setup与setup()下的数据写法

把setup写在script里scriptsetup字符串：ref版：{{strRef}}ref版模板字符串：{{strRefTem}}reactive版：{{strReactive.str}}reactive

空&白·2023-11-25 07:25

同时创建多个websoket（初始化多个连接、断开的重连、每个连接定时发消息、每个连接存储接收的数据（vuex或者pinia））

1.下边的例子演示了创建10个WebSocket实例，当其中某一个连接失败时，会自动进行重连import{ref,reactive,onMounted}from"vue";constperson=reactive

m0_63701303·2023-11-25 02:42

vue一个页面左边是el-table表格当点击每条数据时可以在右边界面编辑表格参数，右边保存更新左边表格数据

5.父组件收到修改过后的值，可以通过字段判断比如id，通过findIndex找到是哪条数据修改了，然后在更新表格数据table.vue新增数据编辑import{ref,reactive}from"vue

m0_63701303·2023-11-25 02:10

Vue3 响应式数据 reactive使用

ref与reactive是vue3提供给我们用于创建响应式数据的两个方法。reactive常用于创建引用数据，例如：object、array等。

小吴吴吴呀·2023-11-25 00:51

Vue3 路由跳转与参数获取

路由跳转import{useRouter}from"vue-router"exportdefault{setup(){constrouter=useRouter();//第一步conststate=reactive

叶子_o·2023-11-24 20:00

登陆页面模板

简单好看的登陆页面vue项目代码可忽略js部分先来个效果图账户密码登录用户名密码验证码登录import{reactive,ref}from'vue'import{Login}from"@/api/index.js

『时光荏苒』·2023-11-24 19:12

标题导航点击导航滑动到指定位置&滑动到指定位置选中对应导航vue3

菜单导航栏点击导航滑动到指定位置&滑动到指定位置选中对应导航效果实现话不多说直接上代码，有用素质三连(点赞、评论、加关注)import{defineComponent,onBeforeUnmount,onMounted,reactive

天生欧皇张狗蛋·2023-11-24 16:43

Vue侦听器

import{reactive,ref,watch}from"vue"constobj=reactive({name:"obj",co

本自具足反求诸己·2023-11-24 14:56

vue3组合api响应式记录

reactive返回对象的响应式副本constobj=reactive({count:0})响应式转换是“深层”的——它影响所有嵌套property。

委鬼傳语·2023-11-24 05:46

Vue3中如何响应式解构 props

以下面的父子组件为例：父组件import{ref,reactive}from"vue";importChildrenfrom"./compon

下雪天的夏风·2023-11-24 05:31

Vue3一些知识

1、reactiveconstobj=reactive({count:0})obj.count++2、ref解包就是不用拿value访问而直接用对象本身会自动解包成value只有顶级的属性会被解包对象里的

白开水为啥没味·2023-11-23 20:28

vue3迁移指南笔记

CompositionAPI1.setup选项是组合API的入口点2.利用reactive实现数据相应式，利用ref将基础数据类型包装成对象类型，使用reactive包裹teleport传送作用：使组件挂载到指定元素中

xin_满眼xin辰·2023-11-23 07:16

Vue 响应式数据的判断

isReactive：检查一个对象是否由reactive创建的响应式数据。isReadonly：检查一个对象是否由readonly创建的只读数据。

小吴吴吴呀·2023-11-23 04:28

Vue 定义只读数据 readonly

readonly深层次只读：reactive数据姓名：{{info.name}}年龄：{{info.age}}修改reactive数据readonly数据姓名：{{readInfo.name}}年龄：{

小吴吴吴呀·2023-11-23 04:54

TypeScript

:string,//可选属性readonlyy:number;//只读属性}constform:loginForm=reactive({username:"",password:'',})//接口函数interfaceSearchFunc

CongJiYong·2023-11-23 04:09

vue3拖拽排序使用 vuedraggable

vue.draggable.nextvue3拖拽排序vue.draggable.next下载pnpmaddvuedraggable@next使用import{reactive}from"vue";importdraggablefrom"vuedraggable

潇、然·2023-11-22 18:08

three.js上传模型文件并加载显示

import{ref,reactive,onMounted,getCurrentInstance}from'vue'import*asTHREEfrom'three'import{OBJLoader}from'three

江苏省精神病院玛主任·2023-11-22 17:46

推荐频道

Reactive