tessl/npm-dcloudio--uni-app-plus

A runtime library for uni-app's app-plus platform, which provides mobile app functionality for the uni-app cross-platform framework

—

Pending

Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

Securityby

Pending

The risk profile of this skill

Overview

Eval results

Files

Navigation APIs

Name: tessl/npm-dcloudio--uni-app-plus
Author: tessl

Comprehensive page navigation and route management capabilities for uni-app applications.

Capabilities

Basic Navigation

Core navigation functions for moving between pages.

/**
 * Navigate to a new page
 * @param options - Navigation options with URL and parameters
 */
function navigateTo(options: NavigateToOptions): void;

/**
 * Redirect to a new page (replace current page)
 * @param options - Redirect options with URL and parameters
 */
function redirectTo(options: RedirectToOptions): void;

/**
 * Navigate back to previous page(s)
 * @param options - Options with delta for number of pages to go back
 */
function navigateBack(options?: NavigateBackOptions): void;

/**
 * Switch to a tab page
 * @param options - Switch options with tab URL
 */
function switchTab(options: SwitchTabOptions): void;

/**
 * Relaunch the application with a new page
 * @param options - Relaunch options with URL
 */
function reLaunch(options: ReLaunchOptions): void;

interface NavigateToOptions {
  url: string;
  animationType?: 'slide-in-right' | 'slide-in-left' | 'slide-in-top' | 'slide-in-bottom' | 'fade-in' | 'zoom-out' | 'zoom-fade-out' | 'none';
  animationDuration?: number;
  events?: object;
  success?: (result: any) => void;
  fail?: (error: any) => void;
  complete?: () => void;
}

interface RedirectToOptions {
  url: string;
  success?: (result: any) => void;
  fail?: (error: any) => void;
  complete?: () => void;
}

interface NavigateBackOptions {
  delta?: number;
  animationType?: 'slide-out-right' | 'slide-out-left' | 'slide-out-top' | 'slide-out-bottom' | 'fade-out' | 'zoom-in' | 'zoom-fade-in' | 'none';
  animationDuration?: number;
  success?: (result: any) => void;
  fail?: (error: any) => void;
  complete?: () => void;
}

interface SwitchTabOptions {
  url: string;
  success?: (result: any) => void;
  fail?: (error: any) => void;
  complete?: () => void;
}

interface ReLaunchOptions {
  url: string;
  success?: (result: any) => void;
  fail?: (error: any) => void;
  complete?: () => void;
}

Page Preloading

Optimize navigation performance with page preloading.

/**
 * Preload a page for faster navigation
 * @param options - Preload options with URL
 */
function preloadPage(options: PreloadPageOptions): void;

/**
 * Unload a preloaded page
 * @param options - Unload options with URL
 */
function unPreloadPage(options: UnPreloadPageOptions): void;

interface PreloadPageOptions {
  url: string;
  success?: (result: any) => void;
  fail?: (error: any) => void;
  complete?: () => void;
}

interface UnPreloadPageOptions {
  url: string;
  success?: (result: any) => void;
  fail?: (error: any) => void;
  complete?: () => void;
}

Page Information

Get information about current page stack and navigation state.

/**
 * Get current page stack
 * @returns Array of page instances in the navigation stack
 */
function getCurrentPages(): Page[];

interface Page {
  route: string;
  options: object;
  $getAppWebview?: () => any;
  $vm?: any;
}

Subpackage Management

Load subpackages for modular application architecture.

/**
 * Load a subpackage
 * @param options - Subpackage loading options
 */
function loadSubPackage(options: LoadSubPackageOptions): LoadSubPackageTask;

interface LoadSubPackageOptions {
  root: string;
  success?: (result: LoadSubPackageResult) => void;
  fail?: (error: any) => void;
  complete?: () => void;
}

interface LoadSubPackageResult {
  root: string;
}

interface LoadSubPackageTask {
  onProgressUpdate(callback: (result: LoadSubPackageProgress) => void): void;
}

interface LoadSubPackageProgress {
  progress: number;
  totalBytesWritten: number;
  totalBytesExpectedToWrite: number;
}

Usage Examples:

import uni from "@dcloudio/uni-app-plus";

// Basic navigation
uni.navigateTo({
  url: '/pages/detail/detail?id=123',
  animationType: 'slide-in-right',
  animationDuration: 300,
  success() {
    console.log('Navigation successful');
  }
});

// Navigate with custom events
uni.navigateTo({
  url: '/pages/webview/webview',
  events: {
    // Listen for events from target page
    acceptDataFromOpenedPage: function(data) {
      console.log('Received data:', data);
    }
  },
  success(result) {
    // Send data to target page
    result.eventChannel.emit('acceptDataFromOpenerPage', { data: 'from opener' });
  }
});

// Navigate back with custom animation
uni.navigateBack({
  delta: 2,
  animationType: 'fade-out',
  animationDuration: 500
});

// Switch to tab page
uni.switchTab({
  url: '/pages/index/index'
});

// Redirect (replace current page)
uni.redirectTo({
  url: '/pages/login/login'
});

// Relaunch application
uni.reLaunch({
  url: '/pages/index/index'
});

// Get current page stack
const pages = getCurrentPages();
const currentPage = pages[pages.length - 1];
console.log('Current page route:', currentPage.route);

// Preload page for better performance
uni.preloadPage({
  url: '/pages/heavy/heavy',
  success() {
    console.log('Page preloaded');
  }
});

// Load subpackage
const loadTask = uni.loadSubPackage({
  root: 'packageA',
  success() {
    console.log('Subpackage loaded');
  }
});

loadTask.onProgressUpdate((result) => {
  console.log('Loading progress:', result.progress + '%');
});

Route Parameters

Handle URL parameters and query strings in navigation.

// Navigation with parameters
uni.navigateTo({
  url: '/pages/detail/detail?id=123&type=product&category=electronics'
});

// In target page, access parameters via:
// this.$route.query.id = '123'
// this.$route.query.type = 'product'
// this.$route.query.category = 'electronics'

// Or in onLoad lifecycle:
export default {
  onLoad(options) {
    console.log('Page parameters:', options);
    // options.id = '123'
    // options.type = 'product'
    // options.category = 'electronics'
  }
}

Navigation Interceptors

Intercept and customize navigation behavior.

// Add navigation interceptor
uni.addInterceptor('navigateTo', {
  invoke(args) {
    console.log('Before navigate:', args.url);
    
    // Modify navigation parameters
    if (args.url.includes('/protected/')) {
      // Check authentication
      if (!isAuthenticated()) {
        args.url = '/pages/login/login';
      }
    }
  },
  success(args) {
    console.log('Navigation successful:', args);
  },
  fail(error) {
    console.log('Navigation failed:', error);
  }
});