Vue - 部分模板

时间:2018-03-17 10:16:55

标签: javascript templates vue.js

我在.vue组件文件中有一个模板。假设我需要重用此模板的一部分(<img :bind1 :bind2 :bind3)我需要这样的东西:

<a v-if=...><img></a> 
<img v-else>

Img是这里代码的相同部分。 最好的方法是什么?

1 个答案:

答案 0 :(得分:1)

如果您需要重复重新创建相同的代码段,最好的方法是使用render function to create a functional component。这是一个简单的例子:

Vue.component('my-img', {
  functional: true,
  render: function (createElement, context) {
    return createElement('img', { attrs: { src: context.props.src } })
  },
  props: {
    src: 'http://example.com/img.png'
  }
})