文章詳情頁
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
排行榜