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

iview实现table里面每行数据的跳转

我的需求是跳转到第三方网站,看官方是写了如何跳转站内路由,不符合我的要求,在csdn发现了一篇文章,我贴一下代码

 

<template><Table border :columns="ReportColumns" :data="ReportData"><template #name="{ row }"><strong>{{ row.name }}</strong></template><template #action="{ row, index }"><!--                                        <a href="http://wwww.baidu.com/" target="_blank">view</a>-->
<!--                                        <Button type="primary" size="small" style="margin-right: 5px"  target="_blank" >View</Button>--><Button type="error" size="small" @click="remove(index)">Delete</Button></template></Table></template>
 data(){return{ReportColumns:[{title: '生成时间',key: 'createTime',width: 220},{title: '生成用户',key: 'creator',width: 200},{title:'报告地址',key:'reportUrl',width: 800,render: (h, params) => {return h('span',{domProps: {innerHTML: "<a href='" + params.row.reportUrl + "' target='_blank'>" + params.row.reportUrl + '</a>'}})}},{title: '操作',slot: 'action',}],

后端接口报文格式

{"ret": true,"code": 0,"msg": "查询成功","content": [{"id": 522,"reportId": 2561,"creator": "李朝阳","createTime": "2023-11-03 12:05:00","reportUrl":"http://192.168.0.1:1111/view/project/5f1e8e97b6e123455555" },{"id": 523,"reportId": 2562,"creator": "白克玲","createTime": "2023-10-03 11:25:00","reportUrl":"https://blog.csdn.net/qq_42772400/article/details/128386185"}]
}

原贴地址

iview table实现通过render实现点击跳转到相应的网址_iview页面跳转-CSDN博客

相关文章:

iview实现table里面每行数据的跳转

我的需求是跳转到第三方网站&#xff0c;看官方是写了如何跳转站内路由&#xff0c;不符合我的要求&#xff0c;在csdn发现了一篇文章&#xff0c;我贴一下代码 <template><Table border :columns"ReportColumns" :data"ReportData"><templ…...

Docker快速搭建Drupal内容管理系统并远程访问

&#x1f3ac; 鸽芷咕&#xff1a;个人主页 &#x1f525;个人专栏:《Linux深造日志》《C干货基地》 ⛺️生活的理想&#xff0c;就是为了理想的生活! 文章目录 前言1. Docker安装Drupal2. 本地局域网访问3 . Linux 安装cpolar4. 配置Drupal公网访问地址5. 公网远程访问Drupal…...

Ansible优化大全

文章目录 一、关闭系统信息收集二、开启加速 Ansible 执行速度修改配置文件/etc/ansible/ansible.cfg由于该功能与sudo冲突&#xff0c;必须关闭 requiretty 选项方法一方法二 参考文章&#xff1a; https://blog.csdn.net/o0o0o0D/article/details/110998873 一、关闭系统信息…...

Python|OpenCV-图像的添加和混合操作(8)

前言 本文是该专栏的第8篇,后面将持续分享OpenCV计算机视觉的干货知识,记得关注。 在使用OpenCV库对图像操作的时候,有时需要对图像进行运算操作,类似于加法,减法,位操作等处理。而本文,笔者将针对OpenCV对图像的添加,混合以及位操作进行详细的介绍说明和使用。 下面,…...

Vue3+vite+cesium环境搭建

引言 目前有不少vue3cesium的配置教学&#xff0c;存在以下两个问题&#xff1a; &#xff08;1&#xff09;vue3cli方式&#xff0c;随着项目的迭代&#xff0c;npm run serve 启动调试很慢&#xff1b; &#xff08;2&#xff09;vue3vite 确实能将调试启动提升不少的&…...

metaObjecthandler 的基本理解与使用(自动插入更新人和创建人)

metaObjecthandler 的基本理解与使用(自动插入更新人和创建人) mysql 自动插入更新和修改时间 更新字段信息 ALTER TABLE test MODIFY create_date timestamp not null default CURRENT_TIMESTAMP; ALTER TABLE test MODIFY update_date timestamp not null default CURRE…...

SpringBoot与ES7实现多条件搜索

SpringBoot与ES7实现多条件搜索 利用Kibana内置的航班数据&#xff0c;查询从威尼斯到中国按票价升序排列的前10条航班数据。 第一步&#xff0c;新建SpringBoot功能&#xff0c;pom.xml引入四个依赖。 <dependency><groupId>org.elasticsearch.client</groupI…...

【排序算法】 快速排序(快排)!图解+实现详解!

&#x1f3a5; 屿小夏 &#xff1a; 个人主页 &#x1f525;个人专栏 &#xff1a; 算法—排序篇 &#x1f304; 莫道桑榆晚&#xff0c;为霞尚满天&#xff01; 文章目录 &#x1f4d1;前言&#x1f324;️快速排序的概念☁️快速排序的由来☁️快速排序的思想☁️快速排序的实…...

急招开发、安全工程师实习生

信息安全工程师-实习生 公司&#xff1a;四川久远银海软件股份有限公司 工作职责 1、负责对公司WEB应用、APP、小程序、公众号等产品进行安全渗透测试&#xff1b; 2、负责对参与攻防演练、护网行动的项目组提供安全技术支撑&#xff1b; 3、负责提供基线核查、风险评估、主…...

数据结构与算法—插入排序选择排序

目录 一、排序的概念 二、插入排序 1、直接插入排序 直接插入排序的特性总结&#xff1a; 2、希尔排序 希尔排序的特性总结&#xff1a; 三、选择排序 1、直接选择排序 时间复杂度 2、堆排序—排升序(建大堆) 向下调整函数 堆排序函数 代码完整版&#xff1a; …...

基于词云图的短信热词数据可视化

热词统计&#xff1a;短信、邮件、微信、QQ、微博、电商评价、新闻、各行业热词&#xff08;旅游、世界杯、战争、考研等&#xff09;、热点事件等场景。 展示模型&#xff1a;给定多段文本&#xff0c;绘制出词云图。 核心思想&#xff1a;根据样本集中的文本包含的高频词…...

Linux/centos上如何配置管理Web服务器?

Linux/centos上如何配置管理Web服务器&#xff1f; 1 Web简单了解2 关于Apache3 如何安装Apache服务器&#xff1f;3.1 Apache服务安装3.2 httpd服务的基本操作 4 如何配置Apache服务器&#xff1f;4.1 关于httpd.conf配置4.2 常用指令 5 简单实例 1 Web简单了解 Web服务器称为…...

Java EE进阶2

包如果下载不下来怎么办? 1,确认包是否存在 2.如果包存在就多下载几次 3.如果下载了很多次都下载不下来,看看是不是下面几步出现了问题? 1)是否配置了国内源 settings.xml 2)目录是否为全英文,存在中文的话就修改路径 3)删除本地仓库的 jar 包,重新下载(可能由于网络的原…...

最新AI系统ChatGPT源码+AI绘画系统源码+支持GPT4.0+Midjourney绘画+搭建部署教程+附源码

一、AI创作系统 SparkAi创作系统是基于OpenAI很火的ChatGPT进行开发的Ai智能问答系统和Midjourney绘画系统&#xff0c;支持OpenAI-GPT全模型国内AI全模型。本期针对源码系统整体测试下来非常完美&#xff0c;可以说SparkAi是目前国内一款的ChatGPT对接OpenAI软件系统。那么如…...

大厂面试题-为什么一线互联网公司严禁使用存储过程

之所以互联网公司不让用&#xff0c;主要有几个方面的原因&#xff1a; 1.存储过程不好调试&#xff0c;一旦涉及到非常复杂的逻辑&#xff0c;定位问题的时候比较麻烦 2.存储过程的一致性很差&#xff0c;如果从Oracle迁移到MySQL&#xff0c;涉及到部分数据库独有特性的时候…...

SpringBoot+Swagger详细使用方法

一、接口文档概述 swagger是当下比较流行的实时接口文文档生成工具。接口文档是当前前后端分离项目中必不可少的工具&#xff0c;在前后端开发之前&#xff0c;后端要先出接口文档&#xff0c;前端根据接口文档来进行项目的开发&#xff0c;双方开发结束后在进行联调测试。 二…...

[动态规划] (十二) 简单多状态 LeetCode 213.打家劫舍II

[动态规划] (十二) 简单多状态: LeetCode 213.打家劫舍II 文章目录 [动态规划] (十二) 简单多状态: LeetCode 213.打家劫舍II题目解析解题思路状态表示状态转移方程初始化和填表顺序返回值提醒 代码实现总结 213. 打家劫舍 II 题目解析 本题是对打家劫舍和按摩师的升级题型&am…...

算法与数据结构之链表

链表的定义&#xff0c;相信大家都知道&#xff0c;这里就不赘述了只是链表分单向链表和双向链表&#xff0c;废话不多说&#xff0c;直接上代码 链表节点的定义&#xff1a; public class Node {int val;Node next;Node pre;public Node(int val, Node next, Node pre) {thi…...

深入剖析React Hooks中的 useCallback

前言 自 React 16.8 版本引入 Hooks 以来&#xff0c;useCallback 成为了前端开发者们越来越青睐的一个功能。useCallback 可以有效优化组件性能&#xff0c;尤其在处理函数式组件中的状态更新时。本文将详细介绍 useCallback 的用法及其注意事项。 1. useCallback 简介 use…...

微服务中配置文件(YAML文件)和项目依赖(POM文件)的区别与联系

实际上涉及到了微服务架构中的两个重要概念&#xff1a;服务间通信和项目依赖管理。在微服务架构中&#xff0c;一个项目可以通过两种方式与另一个项目建立依赖关系&#xff1a;通过配置文件&#xff08;如YAML文件&#xff09;和通过项目依赖&#xff08;如POM文件&#xff09…...

Chapter03-Authentication vulnerabilities

文章目录 1. 身份验证简介1.1 What is authentication1.2 difference between authentication and authorization1.3 身份验证机制失效的原因1.4 身份验证机制失效的影响 2. 基于登录功能的漏洞2.1 密码爆破2.2 用户名枚举2.3 有缺陷的暴力破解防护2.3.1 如果用户登录尝试失败次…...

论文解读:交大港大上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架(二)

HoST框架核心实现方法详解 - 论文深度解读(第二部分) 《Learning Humanoid Standing-up Control across Diverse Postures》 系列文章: 论文深度解读 + 算法与代码分析(二) 作者机构: 上海AI Lab, 上海交通大学, 香港大学, 浙江大学, 香港中文大学 论文主题: 人形机器人…...

DeepSeek 赋能智慧能源:微电网优化调度的智能革新路径

目录 一、智慧能源微电网优化调度概述1.1 智慧能源微电网概念1.2 优化调度的重要性1.3 目前面临的挑战 二、DeepSeek 技术探秘2.1 DeepSeek 技术原理2.2 DeepSeek 独特优势2.3 DeepSeek 在 AI 领域地位 三、DeepSeek 在微电网优化调度中的应用剖析3.1 数据处理与分析3.2 预测与…...

day52 ResNet18 CBAM

在深度学习的旅程中&#xff0c;我们不断探索如何提升模型的性能。今天&#xff0c;我将分享我在 ResNet18 模型中插入 CBAM&#xff08;Convolutional Block Attention Module&#xff09;模块&#xff0c;并采用分阶段微调策略的实践过程。通过这个过程&#xff0c;我不仅提升…...

华为OD机试-食堂供餐-二分法

import java.util.Arrays; import java.util.Scanner;public class DemoTest3 {public static void main(String[] args) {Scanner in new Scanner(System.in);// 注意 hasNext 和 hasNextLine 的区别while (in.hasNextLine()) { // 注意 while 处理多个 caseint a in.nextIn…...

Hive 存储格式深度解析:从 TextFile 到 ORC,如何选对数据存储方案?

在大数据处理领域&#xff0c;Hive 作为 Hadoop 生态中重要的数据仓库工具&#xff0c;其存储格式的选择直接影响数据存储成本、查询效率和计算资源消耗。面对 TextFile、SequenceFile、Parquet、RCFile、ORC 等多种存储格式&#xff0c;很多开发者常常陷入选择困境。本文将从底…...

华硕a豆14 Air香氛版,美学与科技的馨香融合

在快节奏的现代生活中&#xff0c;我们渴望一个能激发创想、愉悦感官的工作与生活伙伴&#xff0c;它不仅是冰冷的科技工具&#xff0c;更能触动我们内心深处的细腻情感。正是在这样的期许下&#xff0c;华硕a豆14 Air香氛版翩然而至&#xff0c;它以一种前所未有的方式&#x…...

【SSH疑难排查】轻松解决新版OpenSSH连接旧服务器的“no matching...“系列算法协商失败问题

【SSH疑难排查】轻松解决新版OpenSSH连接旧服务器的"no matching..."系列算法协商失败问题 摘要&#xff1a; 近期&#xff0c;在使用较新版本的OpenSSH客户端连接老旧SSH服务器时&#xff0c;会遇到 "no matching key exchange method found"​, "n…...

uniapp 字符包含的相关方法

在uniapp中&#xff0c;如果你想检查一个字符串是否包含另一个子字符串&#xff0c;你可以使用JavaScript中的includes()方法或者indexOf()方法。这两种方法都可以达到目的&#xff0c;但它们在处理方式和返回值上有所不同。 使用includes()方法 includes()方法用于判断一个字…...

android13 app的触摸问题定位分析流程

一、知识点 一般来说,触摸问题都是app层面出问题,我们可以在ViewRootImpl.java添加log的方式定位;如果是touchableRegion的计算问题,就会相对比较麻烦了,需要通过adb shell dumpsys input > input.log指令,且通过打印堆栈的方式,逐步定位问题,并找到修改方案。 问题…...