for example, I have a two-level menu
user:{
child:[
{detail},
{update}
]
}
order:{
child:[
{add},
{delete}
]
}
I want to mix all the child routes under all user routes with a mounted;
cannot affect order routing,
I used global blending in main.js and found that even the third-party libraries I introduced would affect
vue does not provide a direct method, but it is not difficult to implement. A relatively simple way is to add judgment
to the global mixin method.
like this
Vue.mixin({
mounted() {
if (this.mixinActive) {
console.log('mixin');
}
},
}); only data presets mixinActive: true in the component. Of course, this judgment can also be determined by this.$options.name to determine the component name, or this.$route to determine the route
Don't you just blend in locally at the user routing place?
// user
<script>
export default {
mixins: [xxx]
}
</script>Global mixin is global as its name implies, and your requirements in the problem description do not match the global, so you cannot use it in this way.
if you want to achieve a similar effect, use provide/inject dependency injection api provided by vue, which should meet the requirements of global injection dependency and local on-demand injection.
In the vue-cli project, I directly introduced the particls library into index.html, and the related files are placed in the static directory . <div id="particles-js">< div> <script type="text javascript" src="s...
1. To make an editable table, I want to be able to use the render method of the table in the AotoComplete, in the editing state, but when displaying, I find that there is a problem with the calculation of the drop-down part of the AotoComplete, sometime...
how can select empty the selected data and display the original placeholder?? here is my code: ...
my current scenario is that the product search page search?a=b&c=d and the product details page item 123 are both in the same router-view ; . I want the effect is that the list page jumps to the details page, then jumps back, and the list pag...
when I started learning vue.js, I reported an error vue.js:525 [Vue warn]: Cannot find element:-sharpapp here is my code: ...
div id= "app " > <child slot= head > <!-- miqi --> i am head < child> <child slot= foot > i am foot < child> < div> <script src=". vue.js">< script> ...
the gulp-nunjucks-render I use will deal with the content in "{{}} ". I haven t found a way to modify it for the time being, so I want to modify the "{{}} " symbol in vue. conflicts with gulp-nunjucks-render has looked for other gulp modules, but ...
this is how it was introduced methods: { loadMap() { return new Promise(function(resolve, reject) { window.init = function() { resolve(qq); }; var script = document.createElement("script"); ...
<template> <div class="navigation"> <div class="logo_image">< div> <div class="control_center">< div> <div class="navigation_list"> <div v-on...
file: D: workspace vueApp qingchi static img 1.jpg can be opened directly using chrome browser, but when I use <img src="file: D: workspace vueApp qingchi static img 1.jpg" alt=""> img tag, the browser prompts Not allo...
vue technology needs to be applied to TV-side pages. TV-side pages do not have the usual click time, and rely on keyboard events to achieve interaction. Have you ever used vue on TV? react is also fine. mainly deals with focus shift and event distributi...
question background: use Baidu Maps (vue-cli 3.x) in vue, problem description: there are no problems and some problems in different Android phones. No problem was found in iPhone : andriod 7 andriod 6 andriod 6 andriod 4 : : http: api....
I m doing a background tab to switch between different options, add different panels, and then add different vue components to the panel the basic style is as follows, no problem at this time wangeditorwrite_article.vuevuemount...
in the Upload of Iview shown in the title, only file.name can get the file name. I tried file.path again, and the result is empty. Ask for help. How to solve the problem that I can t get the absolute path of the local picture there is also a small pr...
this.$Modal.confirm({ render: (h) => { return h( Form , { ref: form }) } }) as above, how the Form added with render is validated. ...
The problem, as noted below, is simply that I called another method in a method in methods, but the method I called did not successfully manipulate the value in my data. I passed the value in this data as a parameter. data(){ return { load...