在vue中引入多个script标签

时间：2025-03-20 09:41:10

注意：vue是单文件，只能直接引入一个script标签，其他的需要去创建。

1.可以在中引入，在HTML文件中可以引入多个script标签。

   <head>
    <script type="text/javascript" src="/api?v=2.0&ak=lOOL1od96eckPqskoImqlosSrcQrsdpH"></script>
  </head>

2.利用Vue的mounted生命周期

const oScript = ('script');
 = 'text/javascript';
 = '///sd/smartCaptcha/0.0.1/';
(oScript);

3.利用Vue的createElement方法,通过引入到组件中

components: {
    'scriptLink': {
      render(createElement) {
        return createElement(
          'script',
          {
            attrs: {
              type: 'text/javascript',
              src: '///sd/smartCaptcha/0.0.1/',
            },
          },
        )
      }
    }

4.第三种方封装一个remoteJs 组件

<template>
    <remote-js src="///sd/smartCaptcha/0.0.1/"></remote-js>
</template>
<script>
export default {
    components: {
    'remote-js': {
      render(createElement) {
        return createElement('script', {attrs: {type: 'text/javascript', src: }});
      },
      props: {
        src: { type: String, required: true}
      }
    }
  }
}
</script>

相关文章