Native Components
Within the development framework of TCMPP, certain components are native, created by the client-side. These native components, implemented by the Mini Program client, boast superior performance and a richer array of features.
Native Components include:
camera: A camera component, utilized for invoking the camera to capture photographs or record videos. Canvas: A canvas component, employed for the creation of graphics, animations, and the like. input (Manifests as a native component only when in focus) textarea: A multiline input box component, designed for the input of multiline text. video: A video component, designed for video playback. live-player: A live streaming player component, designed for the playback of live streams. map: A map component, utilized for the display of maps along with markers, routes, and other features on the map. Usage restrictions for the native components
Given that native components exist outside of the WebView rendering process, the following limitations apply when using them:
The hierarchy of native components is of the highest
order. Therefore, regardless of the z-index
set for other components on the page, they cannot overlay the native components. Subsequently inserted native components can overlay the previously inserted ones.
Native components cannot be used within the <picker-view>
.
Certain CSS styles cannot be applied to native components, for example:
CSS animations cannot be applied to native components.
Defining native components as position: fixed
is not possible.
The display area of native components cannot be cropped by using overflow: hidden
on parent nodes.
Event listeners for native components do not support the bind:eventname
syntax, only bindeventname
is supported. Native components also do not support event binding methods such as catch
and capture
.
Native components will obscure the debug panel popped up by vConsole.
Note:
On the tool, native components are simulated with web components. Hence, in many cases, they cannot accurately replicate the performance on a real device. It is recommended that developers debug on real devices whenever possible when using native components.
Was this page helpful?