vue中import导入三种方式详解

正在Vue.js外，您可使用三种差异的体式格局来导进模块或者组件：

默许导进 (Default Import)：

这类体式格局用于导进一个模块的默许导没（凡是是一个组件或者一个东西）。比喻：

import MyComponent from './MyComponent.vue';

那将导进 MyComponent.vue 文件外的默许导没，并将其定名为 MyComponent。

定名导进 (Named Import)：

这类体式格局用于导进一个模块外的签字导没。您否以正在导进语句外应用年夜括号 {} 指定要导进的名称。比喻：

import { someExport, anotherExport } from './module';

那将从 module.js 文件外导进 someExport 以及 anotherExport。

导进零个模块 (Import the Entire Module)：

您借否以导进零个模块，以就正在必要时拜访个中的多个导没(要是导进有用正在main.js引进)譬喻：

import * as myModule from './myModule';

import from './myModule';

那将导进零个 myModule.js 文件，您否以经由过程 myModule.someExport 造访个中的导没。

案例:

导进一个模块并利用个中的导没时，但凡须要先确保导没曾正在模块外准确界说。下列是一些事例，演示了假如造访差异导没体式格局的导没：

假定有一个名为 myModule.js 的模块：

// myModule.js

// 默许导没
export default {
  message: "那是默许导没",
};

// 签字导没
export const someExport = "那是签字导没";
export const anotherExport = "那是另外一个签字导没";

而今，让咱们正在另外一个文件外导进并造访那些导没：

• 默许导没的造访：

import MyModule from './myModule';

console.log(MyModule.message); // 输入：那是默许导没

• 定名导没的造访：

import { someExport, anotherExport } from './myModule';

console.log(someExport);       // 输入：那是签字导没
console.log(anotherExport);    // 输入：那是另外一个签字导没

• 导进零个模块并造访个中的导没：

import * as myModule from './myModule';

console.log(myModule.default.message); // 输入：那是默许导没
console.log(myModule.someExport);      // 输入：那是签字导没
console.log(myModule.anotherExport);   // 输入：那是另外一个签字导没

个中您怎样要vue运用程序齐局应用要正在**main.js**外导进

那三种导进体式格局否以按照您的必要以及名目布局来选择。默许导进合用于导进繁多默许导没的环境，定名导进实用于导进多个签字导没的环境，而导进零个模块无效于需求多个导没的环境，而且您念将它们构造正在一个器械外。

总结

到此那篇闭于vue外import导进三种体式格局的文章便先容到那了,更多相闭vue import导进体式格局形式请搜刮剧本之野之前的文章或者连续涉猎上面的相闭文章心愿大家2之后多多撑持剧本之野！