vue 组件字符串判断_帮助将vue.js组件注入v-html字符串中的特定位置

vue 组件字符串判断

HTML注入器 (HTML injector)

Helps inject a vue.js component to certain place in v-html string.

帮助将vue.js组件注入v-html字符串中的特定位置。

用法 (Usage)

Import: npm i vue-html-injector

导入: npm i vue-html-injector

import injector from 'vue-html-injector/main.vue'
export default {
  components: {
    injector
  }
}

Raw HTML

原始HTML

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit,</p>  
%%default%%
<p>ed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>

Injector component with HTML prop "content"

具有HTML属性“内容”的喷油器组件

<injector :content="rawHTML">
  <p>{{ new Date().getFullYear() }}</p>
</injector>

多个插槽: (Multiple slots:)

Raw HTML

原始HTML

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit,</p>  
%%image%%
<p>ed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
%%hr%%

Injector component with HTML prop "content"

具有HTML属性“内容”的喷油器组件

<injector :content="rawHTML">
  <template slot="image">
    <image-component src="logo.png" />
  </template>
  <template slot="hr">
    <hr />
  </template>
</injector>

翻译自: https://vuejsexamples.com/helps-inject-a-vue-js-component-to-certain-place-in-v-html-string/

vue 组件字符串判断

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值