Vue 有办法把一大段 html 代码定义为一个变量吗？

[coolair]

<template>
    <package v-if="a">
        <same-node>
            <lots-nodes />
        </same-node>
    </package >
    <same-node v-else>
        <lots-nodes />
    </same-node>
<template>

</lots-nodes /> 这里有很多个 elements，这样就有很大一段重复了，有什么办法解决吗？

[liyang5945]

v-html 绑定一个函数，函数里返回 html 字符串

[horseInBlack]

没看懂你这什么意思，下意识觉得这不是组件吗？定义好然后引用不就行了。

[ayase252]

<same-node /> 不能抽成一个组件？

[Rheinmetal]

element ui 有的组件支持 htmlstring 或者 vnode

[chairuosen]

正经解法是，用 render 方法，https://cn.vuejs.org/v2/guide/render-function.html

[vivalavida000]

抽组件啊

[jguo]

一般来说用这些前端框架之后就不该再在 html 层面考虑问题了

[dfkjgklfdjg]

重复的部分继续组件化，然后 import 进来

[freedomT]

<component is="xxx" />

[wellsc]

为什么会有这种问题

[2i2Re2PLMaDnghL]

《分治》

[cyrbuzz]

可以用 #9 的方法，

```

<components :is="a ? 'package' : 'div'">
<same-node>
<lots-nodes />
</same-node>
</components>
```

[John60676]

1. 抽组件
2. 写 render 函数

[darknoll]

is 或者 render

[pluvet]

jsx?

[shilianmlxg]

谢谢大佬 学到了。有类似 学习如何封装组件的文章或者心得嘛。感觉自己写的代码不知道如何抽出来
@cyrbuzz

[cyrbuzz]

@shilianmlxg

emmm，多造轮子？

没看过类似文章，我自己是先把轮子造出来，不好用就看看难用在什么地方继续造= =。

[shilianmlxg]

@cyrbuzz 确实没试着造过轮子，谢谢大佬

[cyrbuzz]

@shilianmlxg

大佬客气~。

[chenjiangui998]

抽组件和 render 改动都大
比较好的做法是实现一个通用 Node 组件可以挂载任意 Html, Vnode 或者 组件, 类似 react 的高阶组件