标签：can anti html keep post ack default instead class
You can dynamically switch between components in a template by using the reserved <component> element and dynamically bind to its is attribute. By using <keep-alive> you can tell Vue to keep the component in memory.
In the previous post about dynamic component
<component :is="selectedComp"></component> <script> import Vue from "vue" import { Component, Prop } from "vue-property-decorator" const One = { functional: true, name: "One", render: h => <h1 class="bg-red">One</h1> } const Two = { functional: true, name: "Two", render: h => <h1 class="bg-green">Two</h1> } const Three = { functional: true, name: "Three", render: h => <h1 class="bg-purple">Three</h1> } @Component({ components: { } }) export default class App extends Vue { comps = [One, Two, Three] selectedComp = this.comps[0] } </script>
Because inside @Component({components: {}}) haven‘t register those component ‘One, Two, Three‘, so then using
<component :is="selectedComp"></component>
‘selectedComp‘ has to ben a real functional component.
But If we have registered the components:
@Component({
components: {
One, Two, Three
}
})
The the ‘selectedComp‘ can be just component‘s name:
selectedComponent = ‘One‘ | ‘Two‘ | ‘Three‘
<keep-alive> Component:
Components might have some state, you want to keep the state instead of losting it, you can use ‘keep-alive‘ component:
<keep-alive> <component v-bind:is="currentView" v-bind:initial-quantity="item.quantity" v-bind:name="item.text" v-bind:diet="item.diet"></component> </keep-alive>
[Vue @Component] Dynamic Vue.js Components with the component element
标签：can anti html keep post ack default instead class
原文地址：https://www.cnblogs.com/Answer1215/p/9374566.html
