How to use the @tarojs/taro.useState function in @tarojs/taro

function ThreadDetail () {
  // const { loading, replies, topic, content } = this.state
  const [ topic ] = useState(GlobalState.thread)
  const [ loading, setLoading ] = useState(true)
  const [ replies, setReplies ] = useState([])
  const [ content, setContent ] = useState('')

  useAsyncEffect(async () => {
    try {
      const id = GlobalState.thread.tid
      const [{ data }, { data: [ { content_rendered } ] } ] = await Promise.all([
        Taro.request({
          url: api.getReplies({
            'topic_id': id
          })
        }),
        Taro.request({
          url: api.getTopics({
            id

function ThreadDetail () {
  // const { loading, replies, topic, content } = this.state
  const [ topic ] = useState(GlobalState.thread)
  const [ loading, setLoading ] = useState(true)
  const [ replies, setReplies ] = useState([])
  const [ content, setContent ] = useState('')

  useAsyncEffect(async () => {
    try {
      const id = GlobalState.thread.tid
      const [{ data }, { data: [ { content_rendered } ] } ] = await Promise.all([
        Taro.request({
          url: api.getReplies({
            'topic_id': id
          })
        }),
        Taro.request({
          url: api.getTopics({
            id
          })
        })

function ThreadDetail () {
  // const { loading, replies, topic, content } = this.state
  const [ topic ] = useState(GlobalState.thread)
  const [ loading, setLoading ] = useState(true)
  const [ replies, setReplies ] = useState([])
  const [ content, setContent ] = useState('')

  useAsyncEffect(async () => {
    try {
      const id = GlobalState.thread.tid
      const [{ data }, { data: [ { content_rendered } ] } ] = await Promise.all([
        Taro.request({
          url: api.getReplies({
            'topic_id': id
          })
        }),
        Taro.request({
          url: api.getTopics({
            id
          })

export const ArticleList = () => {
  const [getArticlesVariables, setGetArticlesVariables] = useState({
    page: 1,
    pageSize: 100,
    orderSort: 'DESC',
    orderBy: 'id',
  });
  const [getArticlesQuery, setGetArticlesQuery] = useState<{ articles: ArticlesWithPaginationObject }>();
  const [getArticlesLoading, setGetArticlesLoading] = useState(false);

  useEffect(() => {
    setGetArticlesLoading(true);

    apolloClient
      .query({
        query: GET_ARTICLES,
        variables: getArticlesVariables,
        fetchPolicy: 'network-only',
      })
      .then(({ data, loading }) => {
        console.log('THEN', loading);

        setGetArticlesQuery(data);
      })
      .catch(error => {

function Index () {
  const [ loading, setLoading ] = useState(true)
  const [ threads, setThreads ] = useState([])
  useAsyncEffect(async () => {
    try {
      const res = await Taro.request({
        url: api.getLatestTopic()
      })
      setLoading(false)
      setThreads(res.data)
    } catch (error) {
      Taro.showToast({
        title: '载入远程数据错误'
      })
    }
  }, [])

  return (

function BarCode({ text, scale, width, height }) {
  const [image, setImage] = useState('')

  useEffect(() => {
    if (text) {
      setImage(utils.barcode({ text, scale }))
    } else {
      setImage('')
    }
  }, [text, scale])

  const widthString = width ? width + 'px' : ''
  const heightString = height ? height + 'px' : ''
  const style = { width: widthString, height: heightString }
  return <img src="{image}" style="{style}">
}

export function useState (initState) {
  const [state, setState] = Taro.useState(initState)

  const setComboState = newState => {
    if (isObject(newState)) {
      setState(prevState => {
        return { ...prevState, ...newState }
      })
    } else {
      setState(newState)
    }
  }
  return [state, setComboState]
}

function NodeDetail () {
  const [ loading, setLoading ] = useState(true)
  const [ threads, setThreads ] = useState([])

  useLayoutEffect(() => {
    const { full_name } = this.$router.params
    Taro.setNavigationBarTitle({
      title: decodeURI(full_name)
    })
  }, [])

  useAsyncEffect(async () => {
    const { short_name } = this.$router.params
    try {
      const { data: { id } } = await Taro.request({
        url: api.getNodeInfo({
          name: short_name
        })

export function useScope(): Component['$scope'] {
  const [scope, setScope] = useState()
  useDidShow(function (this: Component) {
    setScope(this.$scope)
  })
  return scope
}

export function useStore (store) {
  const [ state, setState ] = useState(store.get())

  function updateState () {
    setState(store.get())
  }

  useEffect(() => {
    store.subscribe(updateState)
    return () => store.unsubscribe(updateState)
  })

  return state
}