vue父子传值和element表格数据问题

今天在处理业务时，出现了一个数据格式不匹配问题

业务需求是 点击其中一条数据，返回数据详情，使用Dialog弹出。

我是通过表格的形式去显示出来，但是这里有个问题就是，我请求后端接口得到的数据是一条对象数据，而表格需要接收的数据是数组。

父组件

父组件中引入并注册子组件

import showview from './showview'
components: { search, TableTools, setfrom, showview },

然后在父组件页面中定义并使用

定义

 Preview: {
  currentId: '',
  showData: []
},

 <el-dialog :visible.sync="dialogfrom.showView" :title="dialogfrom.dialogTitle">
    <showview ref="showv" :show-data="Preview.showData" @close="close"/>
</el-dialog>

页面中使用v-bind绑定 :show-data = Preview.showData (:show-data为表格接收的data数据，Preview.showData传递给子组件的数据)

然后通过方法去请求点击的数据

preview(i) {
	this.dialogfrom.dialogTitle = '题目预览'
	this.dialogfrom.showView = true
	InfoById(this.Preview.currentId).then(res => {
	//这里解决了数据问题 [res.data.item]
	this.Preview.showData = [res.data.item]
 	})
},

子组件

子组件写好样式格式，

在写HTML时，通过:data绑定数据

 :data="showData"

通过 props接收传递过来的参数

 props: {
    showData: {
      type: Array,
      default: () => {
        return []
      }
    }
  },

数据问题的解决方式 就是在请求得到对象的时候，通过**[]**包装它就可以得到数组了。