Spécifiez le nom de l'emplacement dans la fonction de rendu comme ci-dessous :
return createElement(rootcmp, { default: [ createElement(childCmp) ], temp: [ createElement(childCmp2) ] } );
À partir de la fonction de rendu, spécifiez le nom de l'emplacement tel que 'default', 'temp' lors de la création d'éléments enfants.
return createElement(rootcmp, { default: [ createElement(childCmp) ], temp: [ createElement(childCmp2) ] } );
Code complet ci-dessous :
@Component({
props:[]
})
export class TestComponent extends Widget{
items:any[];
render(createElement:any){
const rootcmp = {
template:`<div>
Temp:<slot name="temp"></slot>
Default:<slot></slot>
</div>`
, data:()=>{
return {};
}
}
const childcmp = {
template:'<div slot="default">This is child</div>'
, data:()=>{
return {};
}
}
const childcmp2 = {
template:'<div slot="temp">This is child</div>'
, data:()=>{
return {};
}
}
return createElement(rootcmp
, { default: [ createElement(childcmp) ], temp:[ createElement(childcmp2) ]);
}
}
Comportement attendu:
<div>
Temp:<div>This is child</div>
Default:<div>This is child</div>
</div>
Utilisez createElement(childcmp, { slot: 'temp' })
.
@yyx990803 y a-t-il une raison technique pour laquelle nous devons procéder tel quel ? cette méthode est très peu pratique lorsqu'il s'agit de nœuds générés de manière récursive dans un grand lot, je me demande s'il y a une bonne raison pour laquelle nous ne pouvons pas faire mieux.
En fait, ce createElement(childcmp, { slot: 'temp' })
n'a aucun effet sur un emplacement.
Création d'un rapport de bogue : https://github.com/vuejs/vue/issues/11519
Commentaire le plus utile
Utilisez
createElement(childcmp, { slot: 'temp' })
.