返回介绍

render

发布于 2019-12-27 00:37:38 字数 1361 浏览 1122 评论 0 收藏 0

在提供的 container 里通过指定的 Driver 渲染一个 Rax 元素,并返回该根组件的实例。如果提供了可选的回调函数,该回调将在组件被渲染或更新之后被执行。
注意当首次调用 render 时,会将容器节点里的所有 DOM 元素都替换掉,后续调用时则进行高效更新处理。

方法

render(element, container, options, [callback])

参数

  • element 可以是任意需要渲染的 Rax 组件或字符串
  • container 为任意指定 DOM 渲染容器
  • options
  • hydrate:  指定是否开启 hydrate 渲染模式,默认为 false
  • callback 传入回调函数,将在组件被渲染或更新之后被执行

返回值

当调用该方法时,返回 Rax 元素实例。

示例

可指定对应端的 Driver,也可以指定面向多端项目的 Driver,旨在抹平 Web 与 Weex 的差异,渲染一个组件到根节点:

import { render } from 'rax';
import DriverUniversal from 'driver-universal';

const HelloMessage = function (props) {
	return <h1>{props.name}</h1>
};
render(<HelloMessage name="world" />, document.body, { driver: DriverUniversal })

参考

跨容器渲染

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文