This package is the uni-app Toutiao (ByteDance) mini-program support module that enables developers to compile and deploy uni-app applications to the Toutiao mini-program platform.
—
Quality
Pending
Does it follow best practices?
Impact
Pending
No eval scenarios have been run
Pending
The risk profile of this skill
Core runtime functions for creating and managing Toutiao mini-program applications, pages, and components with proper lifecycle adaptations and platform-specific behavior handling.
Creates a Toutiao mini-program application with proper lifecycle management and platform-specific adaptations.
/**
* Creates a Toutiao mini-program application
* @param options - Application configuration options
* @returns App instance with Toutiao-specific adaptations
*/
function createApp(options: AppOptions): App;
interface AppOptions {
/** Called when the mini-program launches */
onLaunch?: () => void;
/** Called when the mini-program becomes visible */
onShow?: () => void;
/** Called when the mini-program becomes hidden */
onHide?: () => void;
/** Called when an uncaught error occurs */
onError?: (error: string) => void;
/** Additional app-level configuration */
[key: string]: any;
}Usage Example:
import { createApp } from "@dcloudio/uni-mp-toutiao/runtime";
const app = createApp({
onLaunch() {
console.log('Toutiao Mini Program Started');
// Initialize global data or configurations
},
onShow() {
console.log('App became visible');
},
onHide() {
console.log('App became hidden');
},
onError(error) {
console.error('App error:', error);
}
});Creates mini-program pages with Toutiao-specific lifecycle management and proper mock property initialization.
/**
* Creates a mini-program page with Toutiao-specific lifecycle
* @param options - Page configuration options
* @returns Page instance with platform adaptations
*/
function createPage(options: PageOptions): Page;
interface PageOptions {
/** Page data object */
data?: Record<string, any>;
/** Called when page loads with query parameters */
onLoad?: (options: Record<string, any>) => void;
/** Called when page becomes visible */
onShow?: () => void;
/** Called when page is ready for interaction */
onReady?: () => void;
/** Called when page becomes hidden */
onHide?: () => void;
/** Called when page is unloaded */
onUnload?: () => void;
/** Called when page is pulled down to refresh */
onPullDownRefresh?: () => void;
/** Called when page reaches bottom */
onReachBottom?: () => void;
/** Additional page methods and properties */
[key: string]: any;
}Usage Example:
import { createPage } from "@dcloudio/uni-mp-toutiao/runtime";
const pageOptions = createPage({
data: {
userInfo: null,
loading: false
},
onLoad(query) {
console.log('Page loaded with:', query);
this.loadUserData();
},
onShow() {
console.log('Page shown');
},
onReady() {
console.log('Page ready for interaction');
},
loadUserData() {
this.setData({ loading: true });
// Load user data...
}
});Creates mini-program components with enhanced lifecycle management, relationship support, and Toutiao-specific behavior handling.
/**
* Creates a mini-program component with Toutiao-specific behavior
* @param options - Component configuration options
* @returns Component instance with platform adaptations
*/
function createComponent(options: ComponentOptions): Component;
interface ComponentOptions {
/** Component data object */
data?: Record<string, any>;
/** Component properties definition */
props?: Record<string, PropDefinition>;
/** Called when component is attached to DOM */
attached?: () => void;
/** Called when component is ready for interaction */
ready?: () => void;
/** Called when component is detached from DOM */
detached?: () => void;
/** Component relationship definitions */
relations?: Record<string, RelationDefinition>;
/** Custom component methods */
methods?: Record<string, (...args: any[]) => any>;
/** Additional component configuration */
[key: string]: any;
}
interface PropDefinition {
type: any;
value?: any;
observer?: (newVal: any, oldVal: any, changedPath: string) => void;
}
interface RelationDefinition {
type: 'parent' | 'child' | 'ancestor' | 'descendant';
target: string;
linked?: (target: any) => void;
linkChanged?: (target: any) => void;
unlinked?: (target: any) => void;
}Usage Example:
import { createComponent } from "@dcloudio/uni-mp-toutiao/runtime";
const componentOptions = createComponent({
data: {
count: 0,
visible: true
},
props: {
title: {
type: String,
value: 'Default Title',
observer(newVal, oldVal) {
console.log('Title changed:', newVal);
}
},
initialCount: {
type: Number,
value: 0
}
},
attached() {
console.log('Component attached');
this.setData({ count: this.properties.initialCount });
},
ready() {
console.log('Component ready');
},
detached() {
console.log('Component detached');
},
relations: {
'./parent-component': {
type: 'parent',
linked(target) {
console.log('Linked to parent:', target);
}
}
},
methods: {
increment() {
this.setData({ count: this.data.count + 1 });
this.triggerEvent('countChanged', { count: this.data.count });
}
}
});Creates subpackage applications for advanced mini-program architecture with independent lifecycle management.
/**
* Creates a subpackage application
* @param options - Subpackage application options
* @returns SubpackageApp instance
*/
function createSubpackageApp(options: SubpackageAppOptions): SubpackageApp;
interface SubpackageAppOptions {
/** Subpackage launch handler */
onLaunch?: () => void;
/** Subpackage show handler */
onShow?: () => void;
/** Subpackage hide handler */
onHide?: () => void;
/** Additional subpackage configuration */
[key: string]: any;
}Usage Example:
import { createSubpackageApp } from "@dcloudio/uni-mp-toutiao/runtime";
const subpackageApp = createSubpackageApp({
onLaunch() {
console.log('Subpackage launched');
},
onShow() {
console.log('Subpackage shown');
},
onHide() {
console.log('Subpackage hidden');
}
});The runtime includes special handling for Toutiao platform quirks:
ready lifecyclevirtualHost componentsPages automatically receive mock properties for compatibility:
__route__: Current page route__webviewId__: Webview identifier__nodeId__: Node identifier (0 for pages)__nodeid__: Alternative node identifierComponents are automatically registered in a global instances registry for relationship management and debugging purposes. Pages are identified by having nodeId === 0.
class EventChannel {
/** Emit an event to all listeners */
emit(eventName: string, ...args: any[]): void;
/** Listen for events */
on(eventName: string, callback: (...args: any[]) => void): void;
/** Remove event listeners */
off(eventName: string, callback?: (...args: any[]) => void): void;
/** Listen for events once only */
once(eventName: string, callback: (...args: any[]) => void): void;
}EventChannel provides inter-component communication and is available globally via tt.EventChannel.
Install with Tessl CLI
npx tessl i tessl/npm-dcloudio--uni-mp-toutiao