原因一：请求不到数据，vue在拿到数据之前就已经渲染完了页面，所以我们采用延迟渲染页面的方法。先获取数据，再渲染页面。
方法：在mouted中，将要执行的函数使用延时setTimeout()方法包裹。

 mouted:{
     setTimeout(() => {
      this.showRingChart()
     }, 1000)
 }

原因二：异步问题，在还没查询完第一个接口时候，就查询第二个接口。第二个接口中有用到第一个接口中的内容，所以会报错。
方法一：在调用第一个接口的时候使用，加上async，await
    async getOwnerUnit() {
      await DistAPI.getOwnerUnit().then((res) => {//此处是调用接口
        if (res.code == 200) {
          this.ownerUnitList = res.data
        }
      })
    },
方法二：针对异步请求，接口请求顺序问题导致报错，使用.then()方法
 created() {
    this.getOwnerUnit().then(() => {//请求完第一个接口之后，再请求第二个接口，完美！！
      this.getFormDetail()
    })
  },