位置: IT常识 - 正文
目录
一、vue中使用import导入的方法
1.需要在methods中申明引入的方法,或通过自定义方法返回
二、import和export的扩展
export
import
推荐整理分享import在vue中使用(import vue from vue报错),希望有所帮助,仅作参考,欢迎阅读内容。
文章相关热门搜索词:import app from './app.vue',vue.js import,vue import 变量,vue3 import,vue3 import,import vue from vue报错,vue3 import,vue中import怎么用,内容如对您有帮助,希望把文章链接给更多的朋友!
在前端编程的过程中,会经常使用import导入的方式引入一些js方法或公用方法,但在vue中使用时需要注意,在script中可以直接使用引入的方法,在vue模板中直接使用时,会报方法不存在。
1.需要在methods中申明引入的方法,或通过自定义方法返回<template> <div> <p>import中的常量使用:{{ getPI() }}</p> <p>使用import导入的方法:{{ test2() }}</p> </div></template><script>// 通过import导入常量或方法import comm, { test2, test3 } from './comm.js';export default { data() { return {}; }, mounted() { //直接使用import导入的方法 console.log('test', comm.test()); console.log('test2', test2()); }, methods: { // 在methods中申明的import方法,可以tmplate中直接使用 test2, // 通过方法可以直接使用import引入的方法 getPI() { return comm.PI; } }};</script><style lang="scss" scoped></style>comm.js示例
function nameJoin(name) { return `you name id ${name}`;}function test() { return 'test from comm.js';}function test2() { return 'test2';}function test3() { return 'test3';}const PI = 3.14;// 默认导出(每个模块只能有一个)export default { nameJoin, test, PI};// 直接导出export function funName() { return 'you default name is FunName';}// 导出列表export { test2, test3 };二、import和export的扩展exportexport 语句用于从模块中导出实时绑定的函数、对象或原始值,以便其他程序可以通过 import 语句使用它们。
exports 导出方式:
命名导出(每个模块包含任意数量)默认导出(每个模块只能包含一个)// 导出单个特性export let name1, name2, …, nameN; // also var, constexport let name1 = …, name2 = …, …, nameN; // also var, constexport function FunctionName(){...}export class ClassName {...}// 导出列表export { name1, name2, …, nameN };// 重命名导出export { variable1 as name1, variable2 as name2, …, nameN };// 解构导出并重命名export const { name1, name2: bar } = o;// 默认导出export default expression;import静态的 import 语句用于导入由另一个模块导出的绑定。无论是否
上一篇:基于随机森林的特征选择-降维-回归预测——附代码(基于随机森林的气温预测)
下一篇:计算机视觉之姿态识别(原理+代码实操)(计算机视觉姿势评估英语)
友情链接: 武汉网站建设