vue-i18n的组件插槽

vue-i18n的组件插槽

在日常开发中会遇到需要在i18n中插入特殊功能的文本的情况，例如：特殊样式的文本，带有点击功能的文本等，这时候普通的传参已经无法满足我们的需求了，这时候需要用到组件插槽了

举个例子：
现在有一段文本“这是组件插槽的例子”，需要实现“组件插槽”四个字为红色，并且点击后能够执行自定义事件，可以这样写：

// 定义文本格式
const messages = {
	zh: {
		test: '这是{info}的例子',
		info: '组件插槽'
	}
}

在html中使用：

<!-- path：语言环境位置  tag：生成文本的外包裹标签 -->
<i18n path="test" tag="p">
	<template slot="info">
		<span style="color: red" @click="alert('这是自定义事件')">
			{{ $t('info') }}
		</span>
	</template>
</i18n>

解析后文本：

<p>这是<span style="color: red" @click="alert('这是自定义事件')">组件插槽</span>的例子</p>