Reconciler

title: Reconciler

Taro’s runtime includes DOM, BOM, React-compatible layer, Vue-compatible layer, etc., and different platforms or development frameworks may require intrusive customization of the Taro runtime.

To decouple, we refer to the concept of React Reconciler, where the runtime can be customized externally by providing a custom hostConfig configuration object.

In case the configuration items of hostConfig do not meet the requirements and need to be extended, you can submit a PR to Taro ~

hostConfig Configuration

appendChild (parent, child)

Triggered when DOMNode calls appendChild method.

removeChild (parent, child, oldChild)

Triggered when DOMNode calls replaceChild method.

insertBefore (parent, child, refChild)

Triggered when DOMNode calls the insertBefore method.

removeAttribute (element, qualifiedName)

Triggered when DOMElement invokes the removeAttribute method.

setAttribute (element, qualifiedName, value)

Triggered when DOMElement invokes the setAttribute method.

prepareUpdateData (data, page)

Triggered every time the Taro DOM tree is updated, before calling the mini program setData.

appendInitialPage (data, page)

Taro DOM tree initialization, triggered before the first call to the mini program setData. Executed immediately after the call to prepareUpdateData.

getLifecyle (instance, lifecyle)

Called when the lifecycle of the mini program page is triggered.

Needs to return function or function[], indicating the function to be executed.

Example：

// Default value.
// Takes the corresponding lifecycle method directly from the user-written page instance
getLifecyle (instance, lifecyle) {
  return instance[lifecyle]
}
// In React
// the mini program triggers onShow, which calls the user-written componentDidShow
// the mini program triggers onHide, calling the user-written componentDidHide
getLifecyle (instance, lifecycle) {
  if (lifecycle === 'onShow') {
    lifecycle = 'componentDidShow'
  } else if (lifecycle === 'onHide') {
    lifecycle = 'componentDidHide'
  }
  return instance[lifecycle]
}

onTaroElementCreate (tagName, nodeType)

Triggered when DOMElement is constructed.

getPathIndex (indexOfNode)

Triggered when DOMNode gets the path property.

Needs to return a string value representing the array subscript when the mini program is setData by path.

Example:

// Default value
getPathIndex (indexOfNode) {
  return `[${indexOfNode}]`
}
// Baidu smart program does not require [] Parcels
getPathIndex (indexOfNode) {
  return indexOfNode
}

getEventCenter(Events)

Triggered when Taro.eventCenter initializes its value.

Needs to return an instance of the Taro event center, which will be assigned to Taro.eventCenter.

Example:

// Default value:
getEventCenter (Events) {
  return new Events()
}
// In the Alipay mini program
// Priority is given to removing created event center instances from the mini program global object my to avoid problems when subpackaging.
getEventCenter (Events) {
  if (!my.taroEventCenter) {
    my.taroEventCenter = new Events()
  }
  return my.taroEventCenter
}

initNativeApi (taro)

Triggered when referencing the @tarojs/taro package.

Example:

initNativeApi (taro) {
  // Add getApp method to Taro object
  taro.getApp = getApp
}