本文主要介绍vue实现点击按钮“查看详情”弹出窗口显示详情列表操作，有很好的参考价值。希望对大家有帮助。来和边肖一起看看吧。
html：
模板
差异
modal v-model= class status width= 900 title= Details::styles= { top: 80px }
表条带class= task-Table :columns= columns name 4 :data= tasktaillist /Table
/Modal
Div @click=showtaskDetail()单击弹出按钮/div
/div
/模板
js：
脚本
从 @/assets/http.js 导入http
导出默认值{
姓名： xx ，
data () {
返回{
列名4: [
{
标题：“序列号”，
密钥：“id”，
对齐：“居中”，
宽度：70
},
{
标题：姓名，
关键字：“名称”，
对齐：“居中”，
宽度：80
}
],
任务详细列表：[]，
classStatus: false
}
},
方法：{
showtaskDetail () {
this.classStatus=true
},
}
css:
。任务表{页边距-顶部：10px
边距-底部：50px
}
补充知识：
vue通过this.$refs引用子组件出现undefined或者is not a function的错误
1.出现undefined错误
包含子组件的标签需要放在template/template中第一个子选项卡的子选项卡中，并且需要设置ref属性，通过它可以调用子组件的方法或属性，例如
模板
a卡：bordered=false
s表.
/s-表
order-edit ref= modal @ ok= handle ok /！-使用子组件-
/a卡
/模板
这个。$refs.modal.show() //子组件有一个show方法，由“”调用。方法名()`。
2.出现is not a function的错误
2.1.导入，子组件需要导入，因此请确保路径正确。
2.2.2.2.import之后，需要在父组件的组件中注册。
脚本
Import从订购它。/form/ordered it//1。导入并编辑表单子组件。
导出默认值{
名称：订单列表，
//2注册子组件OrderEdit
组件：{
订单编辑
}
//.
}
/脚本
以上vue实现点击按钮“查看详情”弹出窗口显示详情列表操作，是边肖分享的所有内容。希望能给你一个参考，多多支持我们。
