VUE 组合式API

响应式

data

选项式API_响应式

<template><h3>选项式API</h3><p>{{ message }}</p>
</template>
<script>
export default {data(){return{message:"选项式API 绑定数据"}}
}  
</script>

组合式API_响应式

<template><h3>组合式API</h3><p>{{ message }}</p><p>{{ userInfo.name }}</p>
</template>
<script>
import { ref,reactive } from "vue"
export default {setup(){const message = ref("组合式API 绑定数据")const userInfo = reactive({name:"iwen"})return{message,userInfo}}
}</script>

ref和reactive的区别
ref用于创建基本类型响应数据
reactive用于创建引用类型响应数据

简约组合式API

<template><h3>组合式API</h3><p>{{ message }}</p><p>{{ userInfo.name }}</p>
</template>
<script setup>
import { ref,reactive } from "vue"
const message = ref("组合式API 绑定数据")
const userInfo = reactive({name:"iwen"
})</script>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/141136.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

博弈论入门

目录 什么是博弈&#xff1f; 博弈论的发展历史&#xff1f; 博弈的要素有哪些&#xff1f; 博弈的分类&#xff1f; 博弈论的应用 收益矩阵 纳什均衡的定义 博弈论的例子 1、田忌赛马 2、穷途困境 2.1优化反应函数法 2.2Nashpy库 2.3顶点枚举算法 3、Nash游戏 …

飞书开发学习笔记(五)-Python快速开发网页应用

飞书开发学习笔记(五)-Python快速开发网页应用 一.下载示例代码 首先进入飞书开放平台: https://open.feishu.cn/app 凭证与基础信息 页面&#xff0c;在 应用凭证 中获取 App ID 和 App Secret 值。 教程和示例代码位置:https://open.feishu.cn/document/home/integrating-…

WebSocket在node端和客户端的使用

摘要 如果想要实现一个聊天的功能&#xff0c;就会想到使用WebSocket来搭建。那如果没有WebSocet的时候&#xff0c;我们会以什么样的思路来实现聊天功能呢&#xff1f; 假如有一个A页面 和 B页面进行通信&#xff0c;当A发送信息后&#xff0c;我们可以将信息存储在文件或者…

JDK更换版本不生效问题

JDK版本更换 问题: 当本地电脑拥有多个版本jdk时, 切换jdk版本不生效 解决方案: 1.查看环境变量(高版本的jdk安装时自动注入环境变量) 2.将Path里面的jdk的bin配置上移到最上面 3.查看jdk版本, java -version 启动项目,显示如下使用了jdk17

Adobe premiere裁剪视频尺寸并转为GIF格式

第 1 步&#xff1a;裁剪视频 修改序列设置以适应裁剪之后的图像区域&#xff1b;序列中的编辑模式不能使用默认的&#xff0c;这里使用的是“ProRes RAW” 第 2 步&#xff1a;设置背景色 需要设置“颜色遮罩”的大小和颜色&#xff0c;颜色遮罩放在下面。 第 3 步&#xff1…

ELK分布式日志

ELK是指Elasticsearch、Logstash和Kibana三个开源软件的集合&#xff0c;用于构建分布式日志处理系统。 Elasticsearch是一款基于Lucene搜索引擎库的分布式全文搜索和分析引擎&#xff0c;支持多种数据类型的存储、搜索和分析&#xff0c;常用于日志分析、安全监控等领域。 L…

RK3568开发笔记-amixer开机设置音量异常

目录 前言 一、amixer介绍 1. 显示音频设备信息 2. 显示音量信息

el-form添加自定义校验规则校验el-input只能输入数字

0 效果 1 代码 {1,5}是用来限制小数点后几位的 addFormRules: {investAmount: [{ validator: checkInvestAmount, trigger: blur }], }, const checkInvestAmount (rule, value, callback) > {if (value ! && value ! null && value ! undefined) {if (/…

SSL证书对于SEO优化的重要性

SEO是指通过优化网站的内容、结构和技术元素以提升其在搜索引擎结果页上的排名的过程。其中一个经常被忽视但对SEO效果产生深远影响的因素就是SSL证书。 SSL证书是一种数字证书&#xff0c;用于加密网站流量并验证网站身份。它有助于保护用户的敏感数据&#xff0c;并在访问者和…

Django 基于ORM的CURD、外键关联,请求的生命周期

文章目录 基于ORM进行的CURDORM外键关联Django请求的生命周期流程图 基于ORM进行的CURD 本质上就是通过面向对象的方式&#xff0c;对数据库的数据进行增、删、改、查。 这里将会将我们之前所有内容结合到一起&#xff0c;首先确保基于上序操作已经建立好了UserInfo表&#xff…

【BMC】jsnbd介绍

jsnbd介绍 本文主要介绍一个名为jsnbd的开源项目&#xff0c;位于GitHub - openbmc/jsnbd&#xff0c;它实现了一个前端&#xff08;包含HTML和JS文件&#xff09;页面&#xff0c;作为存储服务器&#xff0c;可以指定存储内容&#xff1b;还包含一个后端的代理&#xff0c;这…

【计算机网络】VRRP协议理论和配置

目录 1、VRRP虚拟路由器冗余协议 1.1、协议作用 1.2、名词解释 1.3、简介 1.4、工作原理 1.5、应用实例 2、 VRRP配置 2.1、配置命令 2.2、拓扑与配置&#xff1a; 1、VRRP虚拟路由器冗余协议 1.1、协议作用 虚拟路由冗余协议(Virtual Router Redundancy Protocol&am…

【C++入门篇】保姆级教程篇【下】

目录 一、运算符重载 1&#xff09;比较、赋值运算符重载 2&#xff09; 流插入留提取运算符重载 二、剩下的默认成员函数 1&#xff09;赋值运算符重载 2&#xff09;const成员函数 3&#xff09;取地址及const取地址操作符重载 三、再谈构造函数 1&#xff09;初始化列表 …

C#源代码生成器深入讲解一

C#源代码生成器 01 源代码生成器初体验 新建一个类库&#xff0c;一定是standard2.0版本&#xff0c;否则会出问题。引用Nuget包Microsoft.CodeAnalysis.Common新建一个类&#xff0c;继承自ISourceGenerator接口 //一定要写&#xff0c;制定语言 [Generator(LanguageNames.…

4.2每日一题(求多元函数在某一点的微分)

1、分别求x和y的偏导&#xff0c;再相加即可 2、因为多元函数的表达式不方便求偏导&#xff0c;所以可以使用先代后求法&#xff1a; &#xff08;1&#xff09;对x偏导&#xff1a;把y0代入&#xff0c;很容易求出对x偏导的结果 &#xff08;2&#xff09;对y偏导&#xff1a…

python opencv 读取文件夹下所有MP4文件并解析成jpg图像

你可以使用Python的OpenCV库来读取文件夹中的所有MP4文件&#xff0c;并将其解析为JPG图像。以下是一个示例代码&#xff0c;演示了如何实现这个功能&#xff0c;并设置解析间隔为3帧&#xff1a; import os import cv2def extract_frames(input_folder, output_folder, inter…

caffe搭建squeezenet网络的整套工程

之前用pytorch构建了squeezenet&#xff0c;个人觉得pytorch是最好用的&#xff0c;但是有的工程就是需要caffe结构的&#xff0c;所以本篇也用caffe构建一个squeezenet网络。 数据处理 首先要对数据进行处理&#xff0c;跟pytorch不同&#xff0c;pytorch读取数据只需要给数据…

帝国cms中如何让外部链接直接从新窗口打开页面

<?php if($bqr[isurl]) { ?> <a href"<?$bqsr[titleurl]?>" target"_blank"> <?php } else { ?> <a href"<?$bqsr[titleurl]?>"> <?php } ?>

百度秋招突击手册面试算法题:三数之和

给你一个整数数组 nums &#xff0c;判断是否存在三元组 [nums[i], nums[j], nums[k]] 满足 i ! j、i ! k 且 j ! k &#xff0c;同时还满足 nums[i] nums[j] nums[k] 0 。请 你返回所有和为 0 且不重复的三元组。 注意&#xff1a;答案中不可以包含重复的三元组。 示例 …

2023最新最全【Adobe After Effection 2023】下载安装零基础教程【附安装包】

AE2023下载点这里 教学 1.鼠标右击【Ae2023(64bit)】压缩包选择&#xff08;win11系统需先点击“显示更多选项”&#xff09;【解压到 Ae2023(64bit)】。 2.打开解压后的文件夹&#xff0c;鼠标右击【Set-up】选择【以管理员身份运行】。 3.点击【文件夹图标】&#xff0c;…