wxtools

Обычно используемые инструменты при разработке WeChat в настоящее время представляют собой в основном усовершенствования методов сетевых запросов и Promisify практически для всех асинхронных операций.

• Установить:

 yarn add @evolify/wxtools

или

 npm i @evolify/wxtools

• Сетевой запрос мини-программы

Инкапсулируйте wx.request в стиль Promise. При его использовании просто используйте get, post и другие методы. Поддерживает добавление перехватчиков и может устанавливать заголовок, токен, baseUrl и т. д. отдельно. Ниже в качестве примера используется метод post.

• Импортировать js-файл:

   import { request as req } from '@evolify/wxtools'

• Настроить запрос, обычно настраиваемый в мини-программе App.js>метод onLaunch.

    configReq ( ) {
      //配置baseUrl和拦截器，baseUrl例如 /api
      req . baseUrl ( config . serverUrl )
        . interceptor ( res => {
          switch ( res . data . code ) {
            case 401 : 
              wx . showToast ( {
                icon : 'loading' ,
                title : '重新登录' ,
              } )
              this . login ( )
              return false ;
            case 0 :
              return true ;
            default :
              wx . showToast ( {
                title : '操作失败' ,
              } )
              return false ;
          }
        } )
    } ,

• Установить токен после успешного входа в систему

   req . token ( token )

• Сделать сетевой запрос

   req . post ( '/goods' , data , header )
  	. then ( res => res . data . data )
  	. then ( data => {
      	wx . showToast ( {
              title : '创建成功'
          } )
  	} )

• Использование асинхронной операции Promise

Многие операции в wx API являются асинхронными, и в основном формы параметров аналогичны. Здесь Promise инкапсулирован, а имя метода и параметры соответствуют официальному API, за исключением того, что обратные вызовы успеха и неудачи не нужно передавать в параметрах. . Возьмите showToast в качестве примера и проведите простое сравнение:
Общее использование:

 wx . showToast ( {
  title : '成功' ,
  icon : 'success' ,
  duration : 2000 ,
  success : ( ) => {
    console . log ( '调用成功' )
  } ,
  fail : err => {
    console . error ( '调用失败' , err )
  }
} )

Использование обещания:

 import { Wx } from '@evolify/wxtools'

Wx . showToast ( {
  title : '成功' ,
  icon : 'success' ,
  duration : 2000 ,
} ) . then ( ( ) => {
  console . log ( '调用成功' )
} ) . catch ( err => {
  console . error ( '调用失败' , err )
} )

Использование других API такое же, как и методы, параметры и возвращаемые значения, см. официальную документацию. Если есть ошибки или недостающие элементы, пожалуйста, не стесняйтесь поднять проблему.

• Обещать

   import { promisify } from '@evolify/wxtools'
  
  function func ( {
    param1 ,
    param2 ,
    success : ( ) => { } ,
    fail : ( ) => { }
  } ) {
    // do something
    success ( )
  }
  
  const promisifyFunc = params => promisify ( func , params )
  
  // then you can use
  promisifyFunc ( data )
  	. then ( res => {
    		// on success
  	} )
  	. catch ( err => {
    	// on failed
  } )
  // instand of 
  func ( {
    ... data ,
    success : res => {
      
    } ,
    fail : res => {
      
    }
  } )

• очередь запланированных задач

  В некоторых сценариях нам необходимо определить последовательность отложенных задач. Например, с точки зрения анимации интерфейса некоторые элементы выходят на сцену один за другим с определенным интервалом. В этот момент, если мы напрямую воспользуемся setTimeout, мы столкнемся с ошибкой. проблема уничтожения ада. Код Он уродлив и его сложно поддерживать. Здесь инкапсулирован инструмент для решения таких проблем. Подробное описание можно найти в статье: Очередь запланированных задач js. Использование заключается в следующем:

   import { Schedule } from '@evolify/wxtools'
  
  new Schedule ( ) . task ( task1 )
    . delay ( 1000 ) . task ( ( ) => this . setData ( { title : 'Shedule' } ) )
    . delay ( 500 ) . task ( task3 )