or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

api-integration.mdbuild-system.mdindex.mdparsing-utilities.mdplatform-services.mdruntime.md
tile.json

parsing-utilities.mddocs/

Parsing Utilities

Main package exports for parsing and managing page and component options with Toutiao-specific adaptations and lifecycle management.

Capabilities

Page Option Parsing

Parses page configuration options and applies Toutiao-specific adaptations and lifecycle management.

/**
 * Parse page options with Toutiao-specific adaptations
 * @param options - Raw page configuration options
 * @returns Parsed page options ready for Toutiao platform
 */
function parsePage(options: PageOptions): ParsedPageOptions;

interface PageOptions {
  data?: Record<string, any>;
  onLoad?: (options: Record<string, any>) => void;
  onShow?: () => void;
  onReady?: () => void;
  onHide?: () => void;
  onUnload?: () => void;
  onPullDownRefresh?: () => void;
  onReachBottom?: () => void;
  [key: string]: any;
}

interface ParsedPageOptions {
  data?: Record<string, any>;
  lifetimes: PageLifetimes;
  methods: Record<string, Function>;
  mocks: PageMocks;
  [key: string]: any;
}

interface PageLifetimes {
  onLoad?: (options: Record<string, any>) => void;
  onShow?: () => void;
  onReady?: () => void;
  onHide?: () => void;
  onUnload?: () => void;
  onPullDownRefresh?: () => void;
  onReachBottom?: () => void;
}

interface PageMocks {
  __route__: string;
  __webviewId__: number;
  __nodeId__: number;
  __nodeid__: number;
}

Usage Example:

import { parsePage } from "@dcloudio/uni-mp-toutiao";

const rawPageOptions = {
  data: {
    userInfo: null,
    loading: false
  },
  onLoad(query) {
    console.log('Page loaded:', query);
  },
  onShow() {
    console.log('Page shown');
  },
  customMethod() {
    console.log('Custom page method');
  }
};

const parsedOptions = parsePage(rawPageOptions);
// Returns parsed options with Toutiao-specific adaptations

Component Option Parsing

Parses component configuration options with enhanced lifecycle management and Toutiao-specific behavior handling.

/**
 * Parse component options with Toutiao-specific behavior adaptations
 * @param options - Raw component configuration options
 * @returns Parsed component options with platform adaptations
 */
function parseComponent(options: ComponentOptions): ParsedComponentOptions;

interface ComponentOptions {
  data?: Record<string, any>;
  props?: Record<string, PropDefinition>;
  attached?: () => void;
  ready?: () => void;
  detached?: () => void;
  relations?: Record<string, RelationDefinition>;
  methods?: Record<string, Function>;
  [key: string]: any;
}

interface ParsedComponentOptions {
  data?: Record<string, any>;
  properties: Record<string, PropDefinition>;
  lifetimes: ComponentLifetimes;
  methods: Record<string, Function>;
  relations: Record<string, RelationDefinition>;
  attached?: () => void;
  ready?: () => void;
  detached?: () => void;
  [key: string]: any;
}

interface ComponentLifetimes {
  attached?: () => void;
  ready?: () => void;
  detached?: () => void;
  moved?: () => void;
  error?: (error: Error) => void;
}

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 { parseComponent } from "@dcloudio/uni-mp-toutiao";

const rawComponentOptions = {
  data: {
    count: 0
  },
  props: {
    title: {
      type: String,
      value: 'Default Title'
    }
  },
  attached() {
    console.log('Component attached');
  },
  methods: {
    increment() {
      this.setData({ count: this.data.count + 1 });
    }
  },
  relations: {
    './parent-component': {
      type: 'parent',
      linked(target) {
        console.log('Linked to parent');
      }
    }
  }
};

const parsedOptions = parseComponent(rawComponentOptions);
// Returns parsed options with Toutiao-specific component behavior

Lifecycle Initialization

Initialize page and component lifecycle management systems with Toutiao platform adaptations.

/**
 * Initialize page lifecycle management system
 * Sets up page-specific lifecycle handling for Toutiao platform
 */
function initPageLifetimes(): void;

/**
 * Initialize component lifecycle management system
 * Sets up component-specific lifecycle handling with Toutiao adaptations
 */
function initComponentLifetimes(): void;

Usage Example:

import { initPageLifetimes, initComponentLifetimes } from "@dcloudio/uni-mp-toutiao";

// Initialize lifecycle systems (typically done automatically)
initPageLifetimes();
initComponentLifetimes();

Global Component Instance Registry

Global registry for tracking component instances, supporting relationship management and debugging.

/**
 * Global component instance registry
 * Tracks all component instances for relationship management
 */
interface GlobalInstances {
  [instanceId: string]: ComponentInstance;
}

interface ComponentInstance {
  /** Instance identifier */
  instanceId: string;
  /** Node identifier (0 for pages) */
  nodeId: number;
  /** Component data */
  data: Record<string, any>;
  /** Component properties */
  properties: Record<string, any>;
  /** Component methods */
  methods: Record<string, Function>;
  /** Parent instance reference */
  parent?: ComponentInstance;
  /** Child instances */
  children: ComponentInstance[];
  /** Update component data */
  setData: (data: Record<string, any>) => void;
  /** Trigger custom events */
  triggerEvent: (eventName: string, detail?: any) => void;
}

const instances: GlobalInstances;

Usage Example:

import { instances } from "@dcloudio/uni-mp-toutiao";

// Access all component instances
console.log('Total instances:', Object.keys(instances).length);

// Find pages (nodeId === 0)
const pages = Object.values(instances).filter(instance => instance.nodeId === 0);
console.log('Active pages:', pages.length);

// Access specific instance
const instance = instances['some-instance-id'];
if (instance) {
  console.log('Instance data:', instance.data);
}

Utility Functions

Instance Management

Helper functions for managing component instances and relationships.

/**
 * Check if an instance is a page
 * @param instance - Component instance to check
 * @returns True if instance is a page (nodeId === 0)
 */
function isPage(instance: ComponentInstance): boolean;

/**
 * Initialize component relationships
 * @param instance - Component instance
 * @param relations - Relation definitions
 */
function initRelation(instance: ComponentInstance, relations: Record<string, RelationDefinition>): void;

/**
 * Handle component linking with virtualHost support
 * @param instance - Component instance
 * @param target - Target component to link
 * @param relation - Relation definition
 */
function handleLink(instance: ComponentInstance, target: ComponentInstance, relation: RelationDefinition): void;

Platform-Specific Adaptations

Toutiao Lifecycle Fixes

The parsing utilities include special handling for Toutiao platform quirks:

  • Attached Order Fix: Handles attachment order issues in Toutiao base library 2.0+
  • Event Timing: Special handling for late event reception after ready lifecycle
  • Virtual Host Support: Alternative component linking for virtualHost components
  • Inject/Provide Delay: Workaround for delayed inject/provide initialization

Mock Property Injection

Pages automatically receive mock properties for compatibility:

  • __route__: Current page route path
  • __webviewId__: Webview identifier for the page
  • __nodeId__: Node identifier (always 0 for pages)
  • __nodeid__: Alternative node identifier format

Instance Tracking

All components are automatically registered in the global instances registry with:

  • Unique instance identifiers
  • Parent-child relationship tracking
  • Data and property access
  • Method binding and event handling