首页 > 其他分享 >vue3的ref和reactive函数

vue3的ref和reactive函数

时间:2024-04-06 10:44:37浏览次数:23  
标签:ref 函数 text reactive vue3 声明

  在vue3中需要引入ref和reactive函数对变量进行声明

  

 首先引入ref,reactive函数,vue3不同于vue2的是,变量的声明需要写在setup函数中,(vue2是直接写在data函数中)

其中ref主要是对一些基础数据变量声明,如string,number,boolean, 而reactive则是对复杂的,入对象进行声明

最后,定义完的对象,需要再return中写上,才能在dom标签中使用

附:v-text和v-html的区别

 

使用v-text是直接输出,而v-html会解析其中的样式(富文本使用)

 

 

标签:ref,函数,text,reactive,vue3,声明
From: https://www.cnblogs.com/123-hh/p/18117210

相关文章

  • AMD_Ubuntu_Docker部署firefox
    AMD_Ubuntu_Docker部署firefox下载driverhttps://github.com/mozilla/geckodriver/releasesfirefox好像跟chrome不一样高版本的geckodriver可以兼容低版本的firefox所以理论上应该节约了很大的工作量.https://www.mozilla.org/zh-CN/firefox/linux/https://downl......
  • 从0到1搭建一个Vue3+Electron的框架
    1.前言:上篇文章中使用到了Vue+Electron框架,这一篇文章主要讲解这个框架如何搭建2.Vue3+Vite项目搭建执行命令行,创建Vue3+Vite脚手架:npmcreatevite或yarncreatevite修改脚手架中的无用部分删除src/components下的所有文件修改src/App.vue内容<!--*@......
  • Java登陆第三十八天——VUE3生命周期、钩子函数、组件拼接、组件传参(组件通信)
    生命周期之前在Servlet等也学习过生命周期,相同的,VUE组件也有生命周期。VUE组件完全解析到浏览器,会经过如下过程。(简单理解)vue组件被实例化的过程,称为,组件实例化。组件实例解析到浏览器中,称为,挂载。组件实例从浏览器中删除,称为,卸载。钩子函数vue组件解析到浏览器的......
  • Vue3 + TypeScript + Vite 初始项目搭建(ESLint、Prettier、Sass、Stylelint、husky、p
    仓库地址仓库地址:https://gitee.com/tongchaowei/vue-ts-vite-template项目源码下载:https://gitee.com/tongchaowei/vue-ts-vite-template/releases全局安装pnpm包管理工具执行如下命令在系统全局安装pnpm包管理工具:npmipnpm-g使用Vite脚手架创建Vue3......
  • 从零搭建SpringBoot3+Vue3前后端分离项目基座,中小项目可用
    文章目录1.后端项目搭建1.1环境准备1.2数据表准备1.3SpringBoot3项目创建1.4MySql环境整合,使用druid连接池1.5整合mybatis-plus1.5.1引入mybatis-plus1.5.2配置代码生成器1.5.3配置分页插件1.6整合swagger3(knife4j)1.6.1整合1.6.2使用1.7数据交互处理1.7.1......
  • vue3创建项目实例
    在控制台输入vuecreate文件名(vue3_basis) 选择第三个,默认自行选择安装 选择Router和vuex  选择3.x->vue3全部的选择项如下图 全部选择完后,开始构建项目 ......
  • Vue3 Diff 之 patchKeyedChildren 动态示例
    在学习全网学习各路大神的关于Vue3Diff算法分析文章的时候,一定离不开关键方法patchKeyedChildren。patchKeyedChildren处理的场景比较多,大致有5个主要过程。如果你希望查看不同测试用例下,patchKeyedChildren具体的内部处理过程,可以尝试一下这个:《Vue3Diff之patchKey......
  • VUE3 使用资源路径加载
    1.使用场景有些情况下,我需要使用组件路径动态的方式加载组件。2.实现方法import{defineAsyncComponent}from'vue';/***根据view组件路径异步加载组件.*@param{String}view组件路径这个文件在views下.*@returns{*}*/AppUtil.loadComponent=function(v......
  • Java登陆第三十七天——VUE3响应式基础、条件渲染、列表渲染
    响应式数据什么是响应式数据? 当数据发生改变时,DOM树的内容,会和数据同步更新。 vue3不是自动响应式数据,需要经过函数处理得到响应式数据对象。ref和reactive这两个函数都会返回响应式数据对象,但也有不同。refref通常用于将一个基本类型转为响应式数据对象。基本类型包括:数......
  • postgresql make check报postgres.lto.o:(.note.stapsdt+0x4ac): undefined reference
    如下:/usr/bin/ld:postgres.lto.o:(.note.stapsdt+0x24):undefinedreferenceto`postgresql_statement__status_semaphore'/usr/bin/ld:postgres.lto.o:(.note.stapsdt+0x74):undefinedreferenceto`postgresql_deadlock__found_semaphore'/usr/bin/ld:p......