根据不同的点击内容，展示数据（event）

待我称王封你为后i 2021-09-07 09:00 397阅读 0赞

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L21hb3hpYW9oZWlf_size_16_color_FFFFFF_t_70]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L21hb3hpYW9oZWlf_size_16_color_FFFFFF_t_70 1]

1.第一步，先从后台获取到你要用的id  
2.第二步，循环出来所有数据,渲染到页面上  
3.第三步，给你要点击的绑定上监听事件，绑定id  
4.第四步，根据你点击的id，再拿去请求接口调用数据

methods: { 
    		data() { 
    			return { 
    				transList: [],
    				transid: '',
    				transname: '尚未选择',
    			}
    		},
    			//获取变压器列表里的这个id
    			gettransList() { 
    				this.$http.get('XXXXXX', { 
    					station_id: XXX
    				}).then(res => { 
    					let server = res.data.data;
    					this.transList = [];
    					server.forEach(item => { 
    						this.transList.push({ 
    							trans_name: item.trans_name,
    							trans_id: item.trans_id
    						})
    						console.log(this.transList)
    					})
    				})
    			},
    			// 获取点击的变压器id和名称
    			selectTransId(event) { 
    				//这里的this.transid，我是为了获取点击的事件里的内容，纯粹展示使用
    				this.transid = event.target.dataset.id
    				this.transname = event.target.dataset.name
    			},
    	}

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L21hb3hpYW9oZWlf_size_16_color_FFFFFF_t_70]: /images/20210827/43fba260371f4a2f83935edf51a1941e.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L21hb3hpYW9oZWlf_size_16_color_FFFFFF_t_70 1]: /images/20210827/705b0aaf22724157b759a4db2e65e91c.png