Maison >interface Web >Voir.js >Comment Vue implémente-t-il l'actualisation partielle ? (exemple de code)
Nous savons tous que la composantisation de Vue est son noyau le plus puissant, et le routage est également une partie particulièrement mignonne. Cependant, le routage convient à certains composants volumineux. , des changements se produiront, mais parfois nous souhaitons quelques petites actualisations locales. Pour le moment, nous devons utiliser ses composants dynamiques.
L'élément
Le code est le suivant : slotDome.vue :
<template> <div> <slot></slot> <slot name="wise"></slot> <el-radio-group v-modal="tabView"> <el-radio-button label="simple1" @click="toSim(1)"> <button>页面一</button></el-radio-button> <el-radio-button label="simple2" @click="toSim(2)"><button>页面二</button> </el-radio-button> </el-radio-group> <keep-alive> <component :is="tabView"></component> </keep-alive> </div> </template> <style rel="stylesheet/stylus"> el-radio-button &:hover cursor pointer </style> <script> import simple1 from "./simple/simple1.vue"; import simple2 from "./simple/simple2.vue"; export default{ data(){ return { tabView: "simple1" } }, methods: { toSim(index){ this.tabView = `simple${index}`; } }, components: { simple1, simple2 } } </script>simple1.vue :
<template> <div> 这是页面一 <input type="text"> </div> </template>simple2.vue :
<template> <div> 这是页面二 <input type="text"> </div> </template>Dans l'exemple ci-dessus, lorsque la valeur de tabView change,
Recommandations associées :Pour plus de connaissances liées à la programmation, veuillez visiter :
Un résumé des questions d'entretien avec vue frontale en 2020 (avec réponses)
Recommandation du tutoriel vue : 2020 dernière 5 sélections de didacticiels vidéo vue.js
Introduction à la programmation ! !
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!