vue动态创建dom元素
时间: 2023-08-09 21:07:51 浏览: 153
在Vue中,可以使用createElement函数动态创建DOM元素。createElement函数接受三个参数,分别是标签名、属性对象和子元素。通过调用createElement函数,可以创建一个虚拟节点(vnode),然后将其插入到父元素中。
例如,如果要创建一个div标签,并给其添加子元素,可以使用以下代码:
```javascript
render(createElement) {
return createElement('div', {}, \[
createElement('p', {}, '这是一个段落'),
createElement('span', {}, '这是一个span元素')
\])
}
```
在上述代码中,createElement('div', {}, \[...\])创建了一个div标签,并使用第三个参数添加了两个子元素p和span。
另外,如果想要创建组件节点,可以使用createComponent函数。在Vue的组件系统中,子组件的初始化创建是在createElm函数中进行的。
总结起来,Vue动态创建DOM元素可以通过createElement函数来实现,同时也可以使用createComponent函数来创建组件节点。
#### 引用[.reference_title]
- *1* *3* [Vue.js源码解析-Vue初始化流程之动态创建DOM](https://blog.csdn.net/weixin_57699483/article/details/118994933)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
- *2* [Vue2笔记_01创建vdom并挂载到dom元素上](https://blog.csdn.net/qq_43260366/article/details/126908076)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]
阅读全文