跳到主要内容

useAPICheck

判断小程序的 API，回调，参数，组件等是否在当前版本可用(仅小程序端可用)

何时使用​

无法判断该 API 在当前版本内是否可用时

API​

const [canIUse, setAPI] = useAPICheck(scheme: string)

参数说明​

1. API.method.param.option​

  • API: 代表 API 名字
  • method: 代表调用方法, 有效值为:
    enum METHOD {
      RETURN = 'return',
      SUCCESS = 'success',
      OBJECT = 'object',
      CALLBACK = 'callback',
    }
  • param: 代表参数或者返回值
  • option: 代表参数的可选值或者返回值的属性

2. component.attribute.option​

  • component: 代表组件名字
  • attribute: 代表组件属性
  • option: 代表组件属性的可选值

返回值说明​

返回值说明类型
canIUse是否可用boolean
setAPI更改当前判断的 scheme(scheme: string) => boolean

代码演示​

wechat/useAPICheck/index
import React from 'react';
import { useEffect } from '@taro-hooks/core';
import { escapeState } from '@taro-hooks/shared';
import { useAPICheck, useActionSheet, useToast } from 'taro-hooks';
import DemoContent from '@src/components/DemoContent';
import { Button } from '@taroify/core';

const selection = [
  'getSystemInfoSync.return.screenWidth',
  'showToast.object.image',
  'onCompassChange.callback.direction',
  'request.object.method.GET',
  'live-player',
  'button.open-type.contact',
];

export default () => {
  const { tapItem, show } = useActionSheet({
    alertText: '示例API',
    itemList: selection,
  });
  const [canIUse, setAPI] = useAPICheck(selection[0]);
  const { show: showToast } = useToast({ title: selection[0] });

  useEffect(() => {
    const currentTapItem = escapeState(tapItem);
    if (currentTapItem) {
      setAPI(currentTapItem.tapItem);
    }
  }, [tapItem]);

  useEffect(() => {
    const currentTapItem = escapeState(tapItem);
    const currentCanIUse = escapeState(canIUse);
    if (currentTapItem) {
      showToast({
        title: currentTapItem.tapItem,
        icon: currentCanIUse ? 'success' : 'error',
      });
    }
  }, [tapItem, canIUse]);

  return (
    <DemoContent>
      <Button
        block
        color="primary"
        className="gap"
        onClick={() => show()}
        shape="square"
      >
        选择示例API测试
      </Button>
    </DemoContent>
  );
};

Hook 支持度​

微信小程序H5ReactNative
✔️