vscode develop applets 2

Development tab:

    1. Download Ali icon to create a new folder icons inside

    2. Set in the "windows" in the same layer app.json inside the tab:

 

The default style settings : a small program does not recognize wildcard *!

 

     1.

 

    2. Review the results, the other really is the default:

  

 

Customize Theme Colors:

    1. In the global appwxss in a statement :

  

 

    2. On page using defined theme color variable :

 

    3. Review the results:

 

Use custom components:

    1. New Component

    2. Declare the application:

      Which page to use that component, it is declared in the json file which pages inside.

      A relative path of the key by way of reference.

 

    3. Use components:

    4. css style defined for the component, where a new .less style files, which describe the automatically generated file written to a storage wxss:

 Carousel Figure:

   1. The list of data which set the carousel figure in the js file in the page, sends an asynchronous request for a page to load or get image info:

    2. Check whether it is accepted and assigned to the list:

 

 

    Adaptive and dynamic rendering styles provided in FIG. 3. The rotation:

    

.index_swiper{
    swiper{
        // width: 750rpx;
        height: 340rpx;
        image{
            width:100%;
        }
    }
}

对于可能出现的域名403没有权限的解决方法:

     1.点击详情 -> 勾选不进行域名的合法校验。

     2.或者:添加域名到小程序后台的白名单中(产品上线后推荐使用的方式):

      进入到微信公众号开发平台->开发->服务器域名->request合法域名(在这里进行添加即可)

代码优化——避免异步请求的回调陷阱:

    通过es6的promise解决:

    1.新建:

 

    2.原先的请求方式:

    // 1.发送异步请求获取轮播图数据:
    var reqTask = wx.request({
      url: 'https://api.zbztb.cn/api/public/v1/home/swiperdata',
      success: (result)=>{
        // console.log(result)
        this.setData({
          swiperList:result.data.message
        })
      },
      // fail: ()=>{},
      // // 成功或者失败都会调用的回调函数:
      // complete: ()=>{}
    });

    改用请求方式为:

    

    request({url:"https://api.zbztb.cn/api/public/v1/home/swiperdata"})
    .then(request => {
        this.setData({
          swiperList:result.data.message
        })
    })
   //后期要嵌套调用的话,就多用几个.then:
   //.then()

 

 

 

          

    

Guess you like

Origin www.cnblogs.com/lyjblogg/p/12144066.html