列表添加文字超链接，将数据渲染到另一个页面

qq_39918566

于 2020-03-20 22:36:04 发布

阅读量767

点赞数

文章标签： vue java html

本文链接：https://blog.youkuaiyun.com/qq_39918566/article/details/104995628

版权

本文介绍了在Vue应用中如何将列表数据渲染为带超链接的文字，并通过点击链接在不同页面间传递数据。主要涉及路由设置、插槽使用、事件监听以及避免数据丢失的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

以下是我解决问题的知识点记录，参考了很多网上的知识。如有不正之处，请求斧正！
1.路由方面

	{
   
			
			path: '/plan',
			name: 'plan',
			component: Plan,
			meta: {
   
				title: '工作表'
			}
		},
		{
   
			
			path: '/plande',
			name: 'plande',
			component: Plande,
			meta: {
   
				title: '详情页'
			}
		},

2.携带文字链接的页面

渲染文字使之产生链接，使用<el-link>.例如：
此案例选的是数据库列表的名称：
1）在计划名称里面放入插槽；
2）放入文字链接；
3）添加<a>标签定义超链接，用于从一张页面链接到另一张页面。不用拘泥于别人定义好的例子，可以添加自己的想法。
在<a>标签里面我通过添加一个点击事件来获取点击文字链接数据库位置的ID；

<el-table-column label="名称" prop="name" show-overflow-tooltip&

最低0.47元/天解锁文章