vue引用外部JS的两种种方法

 更新时间:2020年01月28日 11:39:48   投稿:mrr  
这篇文章主要介绍了vue引用外部JS的两种种方案,本文给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下

前言

肯定会遇到没有npm化的库

自己写的js 方法

在Vue中该怎么引用呢

第一种 如果库是es6写的 就可以用import 引入

比如我自己写的http 封装接口的方法

 

就可以这样子导入哦

 

第二种是jquery的库 可以在静态资源导入(或者是cdn资源加载)

 

我是vue-cli 3.0 基础之上架构的

把squire这个富文本框放进public文件下面 在index.html中这样子引用

 

Fannie式总结

自己封装方法 就采用es6方法 这样方便

第三方原生js 或者是jq的插件

直接cdn 这种也是可以的哦 或者是静态资源加载 但是也要注意cdn这个链接资源的稳定性

ps:下面看下Vue.js 引入外部js方法

1、外部文件config.js

第一种写法

//常量的定义
const config = {
 baseurl:'http://172.16.114.5:8088/MGT2'
}
//函数的定义
function formatXml(text) {
  return text
}
//导出 {常量名、函数名}
export {config,formatXml}

第二种写法

//常量的定义
export const config = {
 baseurl:'http://172.16.114.5:8088/MGT2'
}
//函数的定义
export function formatXml(text) {
  return text
}

2、引入config.js里面的常量和方法

 import {config,formatXml} from '../config'//记得带上{}花括号

总结

以上所述是小编给大家介绍的vue引用外部JS的两种种方案,希望对大家有所帮助!

相关文章

  • 浅谈关于.vue文件中style的scoped属性

    浅谈关于.vue文件中style的scoped属性

    本篇文章主要主要介绍了浅谈关于.vue文件中style的scoped属性,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-08-08
  • Vue2实现组件props双向绑定

    Vue2实现组件props双向绑定

    这篇文章主要为大家详细介绍了如何在Vue2中实现组件props双向绑定,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-12-12
  • vue中数据不响应的问题及解决

    vue中数据不响应的问题及解决

    这篇文章主要介绍了vue中数据不响应的问题及解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-09-09
  • Vue中transition单个节点过渡与transition-group列表过渡全过程

    Vue中transition单个节点过渡与transition-group列表过渡全过程

    这篇文章主要介绍了Vue中transition单个节点过渡与transition-group列表过渡全过程,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-04-04
  • vue 如何从单页应用改造成多页应用

    vue 如何从单页应用改造成多页应用

    这篇文章主要介绍了vue 如何从单页应用改造成多页应用,帮助大家更好的理解和使用vue,感兴趣的朋友可以了解下
    2020-10-10
  • VUE中如何调用高德地图获取当前位置(VUE2.0和3.0通用)

    VUE中如何调用高德地图获取当前位置(VUE2.0和3.0通用)

    使用uniapp开发微信小程序时,多多少少会遇到获取当前位置的详细信息,下面这篇文章主要给大家介绍了关于VUE中如何调用高德地图获取当前位置(VUE2.0和3.0通用)的相关资料,需要的朋友可以参考下
    2023-04-04
  • 详解Vue + Vuex 如何使用 vm.$nextTick

    详解Vue + Vuex 如何使用 vm.$nextTick

    这篇文章主要介绍了详解Vue + Vuex 如何使用 vm.$nextTick,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-11-11
  • 在vue中阻止浏览器后退的实例

    在vue中阻止浏览器后退的实例

    今天小编就为大家分享一篇在vue中阻止浏览器后退的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-11-11
  • vue下的@change事件的实现

    vue下的@change事件的实现

    这篇文章主要介绍了vue下的@change事件的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-10-10
  • vue3实现v-model原理详解

    vue3实现v-model原理详解

    这篇文章主要介绍了vue3实现v-model原理详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-10-10

最新评论