Vue.js：使用导入的插件Mixin Localy

问题描述

是否可以在一个组件中使用从VueJS插件导入的mixin？

我已经创建了一个插件，当我导入它时，我可以从我所有的组件中访问mixin的功能。

有没有一种方法可以使它仅在一个组件中可用？还是所有插件都根据定义向Vue添加了全局级别的功能？

解决方法

恕我直言，您应该使用create 2东西：

可在全球范围内导入必需品的插件
需要在所需组件中导入的mixin

示例：

[HttpGet("kitchen-origins")]
        public async Task<ActionResult> GetKitchenOrigins()
        {
            var kitchenOrigins = await _recipeRepository.GetKitchenOriginsWithRecipesAsync();
            return Ok(kitchenOrigins);
        }

在组件中

//main.js
import {MyPlugin} from 'my-library'

vue.use(MyPlugin)

您可以在全局或本地注册一个混合。如果您未在全局范围内注册混入，则它仅在本地注册的组件中可用。 因此，通过本地注册，您可以仅在特定组件中提供混入。

全局注册：，您只需要在main.js文件中声明它
Nb：您不需要在组件中注册mixin

Vue 2：

// main.js
import myMixin from './mixins/myMixin'

Vue.mixin(myMixin)     // makes the plugin globally available 
new Vue({
   // ...
}).$mount('#app')

Vue 3：

// main.js
import myMixin from './mixins/myMixin'

const app = createApp(App)
app.mixin(myMixin)     // makes the plugin globally available 
app.mount('#app')

本地注册：您没有在main.js文件中声明它，而是在相关组件中注册了mixin

// componentWithMixin.vue
import myMixins from "../mixins/myMixin"

export default {
    // ...
    mixins: [myMixins]     // importing the mixin - without this line,the mixin can't be available
}

javascript vue-component vue-mixin vue.js