小程序基本

1. 摸清楚了写代码前的基本配置

1>、下载开发工具,设置appid,创建项目

2.tabbar搭建

 1>、app.json 中
         "tabBar": {
            "color": "#477673",
            "selectedColor": "#ffd1dc",
            "backgroundColor": "#ffeaee",
            "borderStyle": "black",
            "list": [
                {
                "pagePath": "pages/index/index",
                "text": "首页",
                "iconPath": "Resouce/lemon.png"
              },
              {
              "pagePath": "pages/index/index",
              "text": "我的",
              "iconPath": "Resouce/牛油果.png"
              },
              {
            "pagePath": "pages/index/index",
            "text": "商城",
             "iconPath": "Resouce/猕猴桃.png"
              }
          ]
          }

3.获取位置信息

 app.json 中
"permission":{
      "scope.userLocation":{
       "desc":"位置信息"
        }
  },

4. 小程序自带弹窗

/// 第一种: 普通的标题、详情、确定、取消
wx.showModal({
  title: '啊哈哈',
  content: '谈了一个框',
  success: function(res){
    if(res.confirm){
      // that.setData({
      //   motto:"点击确定"
      // })
    /// 第二种: 成功提示的按钮带图标和文字
      // wx.showToast({
      //   title: '成功',
      //   icon:'success',
      //   duration:2000
      // })
  /// 第三种: 只提示文字, 持续几秒后消失
      // wx.showToast({
      //   title: '很多提示文字', /// 提示文字
      //   icon: 'none', //图片
      //   duration: 2000 // 持续时间
      // })
  /// 第四种: 从底部弹出的ActionSheet
      wx.showActionSheet({
        itemList: ["a","b", "c"],
        success: function(res) {
          if(!res.cancel){
            console.log(res.tapIndex) ///  点击了哪个按钮的下标
          }
        }
      })

    } else {
  /// 这种方式可以设置当前元素的文字
      that.setData({
        motto: "点击取消"
      })
    }
  }
})
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容