Vue.js VueJS:渲染组件的动态模板

我的父页面上有一个组件，如下所示：

详细信息.vue

模板：

<feature-list :description="description"></feature-list>

<component :is="subcomponent" :height="overallHeight" :width="overallWidth" :length="overallLength"></component>

特性.vue

模板：

<feature-list :description="description"></feature-list>

<component :is="subcomponent" :height="overallHeight" :width="overallWidth" :length="overallLength"></component>

此说明中的预期返回值。：

  <el-row :gutter="30">
      <el-col :sm="24">
        <ul class="dimensions d-flex">
          <li class="dimension">
            <img src="/length.jpg" alt="">
            <h4 class="title">Length</h4>
            <p class="base-copy">{{length}}</p>
          </li>
          <li class="dimension">
            <img src="/height.jpg" alt="">
            <h4 class="title">Height</h4>
            <p class="base-copy">{{height}}</p>
          </li>
          <li class="dimension">
            <img src="/width.jpg" alt="">
            <h4 class="title">Width</h4>
            <p class="base-copy">{{width}}</p>
          </li>
        </ul>
      </el-col>
    </el-row>

长度
{{length}


高度
{{height}


宽度
{{width}

如何将模板发送到组件？并渲染值（长度、宽度和高度）

---

有点像，唯一的区别是，模板来自ajax调用。

经过一些挖掘，我找到了解决这个问题的方法，想法是将

模板和
道具作为对象传递给
is
道具

代码如下所示

<component 
 :is="description && { template: `<div>${description}</div>`, props: ['height', 'width', 'length'] }" 
 :height="overallheight" 
 :width="overallwidth" 
 :length="overalllength">
</component>