vue文件中引入外部js
1.在项目的入口文件中(app.js)定义remoteScript标签
Vue.component('remote-script', {
render: function (createElement) {
var self = this;
return createElement('script', {
attrs: {
type: 'text/javascript',
src: this.src
},
on: {
load: function (event) {
self.$emit('load', event);
},
error: function (event) {
self.$emit('error', event);
},
readystatechange: function (event) {
if (this.readyState == 'complete') {
self.$emit('load', event);
}
}
}
});
},
props: {
src: {
type: String,
required: true
}
}
});
2.在所需要的引入外部js的页面使用
<remote-script src=""></remote-script>
src位置的地址里面填要引入js文件的地址即可
vue文件中引入外部js的更多相关文章
- 在Vue文件中引入外部URL链接
前言:最近做一个vueNuxt的项,没有index.html 也没有main.js项目需要引入一些外部的包,没什么技术含量只是一种思路 在vue生命钩子函数中动态创建JavaScript标签追加到HT ...
- vue组件如何引入外部.js/.css/.scss文件
可在相应的单vue组件引入相应文件. 1.引入外部.js文件. 2.引入外部.css文件. 使用@import引入外部css,作用域是全局的,也可在相应的单vue组件引入,import并不是引入代码到 ...
- html中引入外部js文件,使用外部js文件里的方法
外部js文件1: /** * 加了window.onload 后,直接引入js文件即可 * 页面资源全部加载完毕后会自动调用window.onload里的回调函数 */ window.addEvent ...
- Angular中引入外部js的使用方式
在Angular中我们或许会用到部分外部插件的时候,像Bootstrap,Jquery这些当然我们可以通过Npm安装包的形式引入,但是还有一些其它的js库需要引入的话,我们又应该怎样操作呢? 在这里做 ...
- Vue项目中引入外部文件(css、js、less)
例子中css文件采用bootstrap.css,js文件采用jQuery,less文件用less.less(自定义文件) 步骤一:安装webpack cnpm install webpack -g 步 ...
- Vue文件中引入img 路径写法
把图片路径写在data里面,然后渲染模板的两种方式 方案1.在data使用require将图片进入,写法如下 logo: require('../asset/admin/logo.png') 在模板 ...
- vue页面引入外部js文件遇到的问题
问题一:vue文件中引入外部js文件的方法 //在vue文件中 <script> import * as funApi from '../../../publicJavaScript/pu ...
- Js文件中调用其它Js函数的方法
在项目开发过程中,也许你会遇这样的情况.在某一Js文件中需要完成某一功能,但这一功能的大部分代码在另外一个Js文件中已经完成了,自己只需要调用这个方法再加上几句代码就可以实现所需的功能.我们知道,在h ...
- vue2项目中引用外部js文件
vue2项目目录如下(utils文件夹是自己手工建的,然后在utils里新建js文件): 使用import导入文件时,注意路径,路径不对会报错: 导入之后使用外部js函数时,直接写导入时的名字加小括号 ...
随机推荐
- AXI总线介绍
原帖地址:https://wenku.baidu.com/view/7c424c17e3bd960590c69ec3d5bbfd0a7956d5b9.html 1.AXI简介 AXI(Advanc ...
- 【PMP】项目生命周期和开发生命周期
一.定义 项目生命周期:指项目从启动到完成所经历的一系列阶段. 开发生命周期:项目生命周期内通常有一个或多个阶段与产品.服务或成果的开发相关,这些阶段称为开发生命周期. 二.生命周期 预测型生命周期( ...
- Xcode9.2打包图片显示异常解决方案
链接:https://www.jianshu.com/p/ca0bbb403143來源:简书 在使用Xcode9.2适配iPhone X的过程中遇到了部分图片显示异常(不显示或花掉)的问题.主要分两种 ...
- POSIX 线程清理函数
POSIX 多线程的 cleanup 函数 控制清理函数的函数有两个,一个是 pthread_cleanup_push(), 用来把清理函数压入栈中,另一个是 pthread_cleanup_pop( ...
- Navicat(数据库可视化操作软件)安装、配置、测试
Navicat(数据库可视化操作软件)安装.配置.测试(win7_64bit) 目录 1.概述 2.本文用到的工具 3.Navicat安装.激活与配置 4.简单测试 5.注意事项 6.相关博文 > ...
- Sublime text 3 格式化代码 插件
JsFormat: 重新打开sublime就能使用js格式化插件 使用方法: 1.快捷键:ctrl+alt+f 2.或者先用快捷键打开命令面板 “ctrl + shift + p”, 再输入 “For ...
- idea 配置 maven 项目
maven 项目 用模块引入进来 1.引入 pom.xml 2.如果不是web则要添加web支持 3.配置资源 类 和依赖 and 项目语言环境 5.配置 artifacts 部署 w ...
- .NET EntityFrameworkCore.DbUpdateException 错误
Microsoft.EntityFrameworkCore.DbUpdateException: An error occurred while updating the entries. See t ...
- 红米3 TWRP-3.2.1-0(android_7.1.2_r29) 刷8.1不提示错误 刷MIUI不再卡屏 修复无系统重启问题 更新于20180316
TWRP简介: TWRP是一个安卓平台很受欢迎的第三方REC,界面好看,功能强大. TWRP更新日志: 20180316更新: 1.使用最新android-7.1.2_r29分支源码适配. 2.更新版 ...
- C++ STL堆操作
/* STL 最大堆.最小堆的应用 */ #include <iostream> #include <vector> #include <algorithm> // ...