文章详情页
vue 导入js中的两种方法(示例详解)
浏览:4日期:2022-06-13 09:14:45
目录1 方法一:使用 标签2 方法二:使用 import 语句3 举例3.1 js文件3.2 vue 导入js文件4 举例4.1 js文件4.2 vue 导入js文件 -->XXX 是一个自定义的变量名5 修改文件后一定要保存 在运行1 方法一:使用 标签然后,在组件的方法中,你就可以直接调用 JavaScript 文件中定义的函数了:export default { methods: { yourMethod() { yourFunction1(); yourFunction2(); yourFunction3(); } }}2 方法二:使用 import 语句在 Vue 组件的 JavaScript 文件中,使用 import 语句引入 JavaScript 文件中的函数:import { yourFunction1, yourFunction2, yourFunction3 } from './your-file.js';然后,在组件的方法中,你就可以直接调用引入的函数了:export default { methods: { yourMethod() { yourFunction1(); yourFunction2(); yourFunction3(); } }}3 举例3.1 js文件// functions.jsexport function function1() { // 函数1的逻辑}export function function2() { // 函数2的逻辑}export function function3() { // 函数3的逻辑}3.2 vue 导入js文件// YourComponent.vueimport * as functions from './functions.js';export default { methods: { yourMethod() { functions.function1(); functions.function2(); functions.function3(); } }}4 举例4.1 js文件// functions.jsfunction function1() { // 函数1的逻辑}function function2() { // 函数2的逻辑}function function3() { // 函数3的逻辑}export default { function1, function2, function3}4.2 vue 导入js文件 -->XXX 是一个自定义的变量名import XXX from './functions.js';export default { methods: { yourMethod() { XXX.function1(); XXX.function2(); XXX.function3(); } }}5 修改文件后一定要保存 在运行
到此这篇关于vue 导入js中的方法的文章就介绍到这了,更多相关vue 导入js内容请搜索好吧啦网以前的文章或继续浏览下面的相关文章希望大家以后多多支持好吧啦网!
标签:
JavaScript
排行榜
