naive-ui NPopconfirm怎么用vue3的h()渲染

先看效果

然后我先贴代码, 你们看懂的先运行下,

文章后面我教你怎么 添加这种有template,有slot插槽的组件

h(
	NPopconfirm,
	{
		positiveButtonProps: {
			size: 'tiny',
			color: '#007293',
			bordered: true,
		},
		negativeButtonProps: {
			size: 'tiny',
			color: '#007293',
			bordered: true,
		},
		onPositiveClick: (e: any) => {
			alert(1)
		}
	},
	{
		trigger: () => {
			return h(
				NButton,
				{
					class:"c_yellow mr_10 mb_10",
					strong: true,
					tertiary: true,
					size: 'small',
				},
				{ default: () => '删除' }
			)
		},
		default: () => {
			return '确认删除该节点?'
		}
	}
),

正文

以提示窗组件为例,官方地址为==》Naive UI

这个部分 就是下图左边部分驼峰写法

然后你vscode 键盘ctrl+鼠标左键 点击他

 

然后同样的方法查看ButtonProps,你就知道里面的size,color这些要怎么写

 然后就是下面这部分哪里查

 点这个

会跳到下面的页面===》Naive UI 

 因为h(a,b,c)   a是组件,b是属性,c是包含啥,所以如图,这里下面就是c的可以填啥,trigger就相当于  你的 h("div",[h(),h()])  这个案例里面的  [h(),h()],然后其实你就知道怎么搞了

trigger()触发弹出信息的组件或元素
footer()弹出的 footer 内容2.31.0
header()弹出的 header 内容
default()弹出的内容

 

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

k8s 基本架构

k8s 中支持的 node 数 和 pod 数 k8s 也是逐步发展过来的,来看看以前和现在支持的 node 数 和 pod 数对比 node 即 节点 , 早期的 k8s 版本能够支持 100 台节点,现在 k8s 可以支持到 2000 台了 pod 数,早期的版本可以支持 1000 …

CleanMyMacX4.13.4中文免费版mac电脑管家

CleanMyMac X这款软件集成清理、mac保护、速度优化维护、应用程序管理和文件管理5大功能,使用过程安全高效,用户不必担心误操作导致系统的崩溃。作为一款专业的mac电脑系统管家,CleanMymac X一直致力于更加智能、便捷地全方位维护我们的电脑&…

最近跳槽,压力真大...

前几天,跟个老朋友吃饭,他最近想跳槽去大厂,觉得压力很大,问我能不能分享些所谓的经验套路。 每次有这类请求,都觉得有些有趣,不知道你发现没有大家身边真的有很多人不知道怎么面试,也不知道怎…

数据库表的操作

目录 前言 1.创建表 2.查看表 2.1查看表结构 2.2查看表中插入的数据 3.修改表 4.删除表 总结 前言 前面已经介绍了对数据库的操作,今天我们介绍的是数据库表的操作,数据库表简单可以理解为存储数据的介质。有了这个认识之后,下面我们…

系统架构设计师 2:计算机基础

一、计算机硬件 1 处理器(CPU) 处理器是计算机系统运算和控制的核心部件。 1.1 指令集 处理器的指令集按照其复杂程度可分为复杂指令集(CISC)与精简指令集(RISC)。 随着研究的深入,RISC已经…

Python面向对象编程1-面向过程的简单纸牌游戏程序 项目1.6 完整的猜大小纸牌游戏

总项目目标:用面向过程思想设计一个简单的纸牌游戏程序,称为"Higher or Lower"(高还是低)。游戏中,玩家需要猜测接下来的一张牌是比当前牌高还是低。根据猜测的准确性,玩家可以得到或失去相应的积…

2024考研408-计算机组成原理第三章-存储系统

文章目录 前言一、存储器概述1.1、层次结构1.2、存储器分类1.2.1、层次分类1.2.2、存储介质分类1.2.3、存取方式1.2.4、按照信息的可更改性(读写、只读区别) 1.3、存储器性能指标知识回顾 二、主存储器2.1、主存储器的基本组成(介绍DRAM&…

专业是要选软工还是人工智能?

大家好,我是帅地。 在帅地的训练营里,也有不少 26 届的学员,不过大一即将过去,部分学校是到了大一后面或者大二才开始细分专业方向的,包括一些想要转专业的同学,也需要选择一个细分的方向,而且…

Python基础知识进阶之数据爬虫

一、爬虫概述 爬虫是指利用网络抓取模块对某个网站或者某个应用中有价值的信息进行提取。还可以模拟用户在浏览器或者APP应用上的操作行为,实现程序自动化。简单来说就是我们把互联网有价值的信息都比喻成大的蜘蛛网,而各个节点就是存放的数据&#xff0…

Vue-Element-Admin项目学习笔记(7)用Node.js写一个简单后端接口

前情回顾: vue-element-admin项目学习笔记(1)安装、配置、启动项目 vue-element-admin项目学习笔记(2)main.js 文件分析 vue-element-admin项目学习笔记(3)路由分析一:静态路由 vue-element-adm…

黑苹果 或者 Mac 因 mds资源占用过高,导致频繁死机

开机后不久,风扇狂转,温度升高,然后死机,关机。 1. 使用 “Apple 诊断”测试 Mac 先看看硬件层面是否有问题。 使用“Apple 诊断”测试 Mac。 这款 Mac 的处理器是 Intel ,开启 Mac,然后在 Mac 启动时立…

状态机编程实例-嵌套switch-case法

嵌入式软件开发中,状态机编程是一个比较实用的代码实现方式,特别适用于事件驱动的系统。 本篇,以一个炸弹拆除的小游戏为例,介绍状态机编程的思路。 C/C语言实现状态机编程的方式有很多,本篇先来介绍最简单最容易理解…

KW 新闻 | KaiwuDB 亮相数字中国并发布离散制造场景解决方案

4月26-30日,以“加快数字中国建设,推进中国式现代化”为主题的第六届数字中国建设峰会在福州市圆满召开。KaiwuDB 受邀亮相大会参展并发布“离散制造场景解决方案”,旨在以数字化方案驱动生产方式、治理方式变革,推进离散制造业物…

45道SQL题目陆续更新

文章目录 学习视频配置环境第一天内连接 外连接sql执行顺序 第二天group by 的用法 第三天第四天order bycase when窗口函数 第五天第六天第七天limit第八天 45、查询下月过生日的学生信息 学习视频 学习视频 配置环境 四张表 配置四张表的sql语句 #创建发据库 create dat…

TOGAF10®标准中文版--(阶段A — 架构愿景)方法

3.5.1 概述 阶段 A 从收到发起组织向架构组织发出的架构工作请求开始。 在TOGAF 标准 —EA能力和治理中讨论了确保公司管理层的适当认可和确认,以及直线管理层的支持和承诺所涉及的问题。 A阶段还定义了架构工作的范围内和范围外的内容以及必须处理的约束条件。在…

浅析 xml 数据格式文件

浅析 xml 数据格式文件 xml ( Extensible Markup Language ) 全称 -> 可拓展的标记语言; xml文件的主要用途:xml文件主要用于数据的 传输 和 存储,并不是展示; xml标签与html的区别:节点的标签使用方式和 html 十分…

linuxOPS系统服务_linux高级命令

find命令 find 路径 [选项 选项的值] … 选项作用-name根据文件的名称进行-type按文件类型进行搜索,f代表普通文件,d代表文件夹 find命令查找文件 示例1 查找一个文件 案例1 ,在linux整个系统中查找 test.txt文件 find / -name test.txt -type f案例…

算法刷题-字符串-重复的子字符串

KMP算法还能干这个 459.重复的子字符串 力扣题目链接 给定一个非空的字符串,判断它是否可以由它的一个子串重复多次构成。给定的字符串只含有小写英文字母,并且长度不超过10000。 示例 1: 输入: “abab” 输出: True 解释: 可由子字符串 “ab” 重复两…

Ubuntu下载速度过慢解决

今天用Ubuntu下载Roberta文件到本地,速度特别慢,Ubuntu 系统自带的源文件,都是国外的源网址,在国内下载安装升级源或者依赖的时候,都比较慢,更换国内的源地址,轻松搞定此问题。 目录 一、备份…

ChatGPT的未来发展

文章目录 1.什么是ChatGPT2.ChatGPT的基础技术3.ChatGPT工作原理4.ChatGPT应用场景5.ChatGPT局限性6.ChatGPT的未来发展 ✍创作者:全栈弄潮儿 🏡 个人主页: 全栈弄潮儿的个人主页 🏙️ 个人社区,欢迎你的加入&#xff…