当前位置: 首页 > news >正文

vueday01——使用属性绑定+ref属性定位获取id

1.属性绑定(Attribute 绑定)

第一种写法

<div v-bind:id="refValue"> content </div>

第二种写法(省略掉v-bind)

<div :id="refValue"> content </div>

2.代码展示

<template><div :id="idValue" ref="myDiv">我是待测div</div><button @click="printId">Print ID {{ resultId }}</button>
</template><script setup="ts">
import { ref } from 'vue'// 响应式状态
const idValue = ref("defaultValue")
const resultId =ref("")
// 用来修改状态、触发更新的函数
// const  increment = ()=> {
//   count.value++
// }
const printId =()=>{resultId.value=idValue.value;
}
// const rawHtml ="<span style='color:red'>htmlTest</span>"</script>

3.结果展示

4.绑定含有多个属性的对象

 

http://www.lryc.cn/news/195365.html

相关文章:

  • LeetCode 260. 只出现一次的数字 III:异或
  • 使用PyTorch解决多分类问题:构建、训练和评估深度学习模型
  • 基于nodejs+vue网课学习平台
  • 读书笔记:Effective C++ 2.0 版,条款13(初始化顺序==声明顺序)、条款14(基类有虚析构)
  • flutter开发实战-下拉刷新与上拉加载更多实现
  • 旧手机热点机改造成服务器方案
  • 网工实验笔记:策略路由PBR的应用场景
  • webrtc快速入门——使用 WebRTC 拍摄静止的照片
  • 预约按摩app软件开发定制足浴SPA上们服务小程序
  • jenkins出错与恢复
  • ssh免密登录的原理RSA非对称加密的理解
  • 【监督学习】基于合取子句进化算法(CCEA)和析取范式进化算法(DNFEA)解决分类问题(Matlab代码实现)
  • 力扣每日一题41:缺失的第一个正数
  • OpenCV与mediapipe实践
  • 【css拾遗】粘性布局实现有滚动条的情况下,按钮固定在页面底部展示
  • git 创建并配置 GitHub 连接密钥
  • 使用Premiere、PhotoShop和Audition做视频特效
  • vueday01——动态参数
  • 双向链表C语言版本
  • visual studio安装时候修改共享组件、工具和SDK路径方法
  • Motorola IPMC761 使用边缘TPU加速神经网络
  • EM@直线的参数方程
  • day08-注册功能、前端登录注册页面复制、前端登录功能、前端注册功能
  • rust: function
  • 零代码编程:用ChatGPT批量下载谷歌podcast上的播客音频
  • nginx.4——正向代理和反向代理(七层代理和四层代理)
  • 基于RuoYi-Flowable-Plus的若依ruoyi-nbcio支持自定义业务表单流程(三)
  • Spring-事务源码解析2
  • 基于ssm008医院门诊挂号系统+jsp【附PPT|开题|任务书|万字文档(LW)和搭建文档】
  • 【Linux常用命令11】Linux文件与权限详解