标签：总结 function 微信 var setData date 第一阶段 data con

一、项目目录：

1、其中项目级别的的文件包括 app.js、app.json、app.wxss 这三个。

app.js是小程序的脚本代码；app.json 是对整个小程序的全局配置；app.wxss 是整个小程序的公共样式表。

2、微信小程序中的每一个页面都需要写在 app.json 的 pages 中，每一个页面是由同路径下同名的四个不同后缀文件的组成，如：index.js、index.wxml、index.wxss、index.json。

3、事件处理函数：

// 事件处理函数
  bindViewTap() {
    wx.navigateTo({
      url: '../logs/logs'
    })
  },
  onl oad() {
    if (wx.getUserProfile) {
      this.setData({
        canIUseGetUserProfile: true
      })
    }
  },

4、wxss:

常用css样式

width设置宽度

height设置高度

color设置文本颜色

background-color设置背景颜色，background-image设置背景图片，不能本地路径,可以使用网络地址，或者base64位图片，

border设置边框，dotted - 定义点线边框，dashed - 定义虚线边框，solid - 定义实线边框

，double - 定义双边框

margin设置外边距

padding设置内边距。

5、wxml:

text引入文字；button按钮；input输入框；icon小图标；image引入图片；view容器。

6、icon、progress和swich

icon组件设置一些提示类的小图标；

progress进度条；

swich开关按钮。

7、swiper：

swiper组件用于编写轮播图 <swiper> <swiper-item> <imag></swiper-item></swiper>

autoplay属性设置是否自动播放。

二：云平台：

1、音乐播放器：

// 创建音频
const innerAudioContext = wx.createInnerAudioContext()
// 自动播放
innerAudioContext.autoplay = true
// 设置播放地址
innerAudioContext.src='cloud://zsh-gmx9p.7a73-zsh-gmx9p-1257218395/aa.m4a'
// 加循环
innerAudioContext.loop=true
Page({

    /**
     * 页面的初始数据
     */
    data: {
        num:1
    },
    change:function(){
        if(this.data.num==0){
            this.setData({
                num:1
            })
            // 播放音乐
            innerAudioContext.play()
        }else{
            this.setData({
                num:0
            })
             // 暂停音乐
             innerAudioContext.pause()
        }
    },

2、评论界面制作：

 data: {
        list:[
            {
                con:"君乐宝可真倒霉，碰上倒割商家韭菜的了",
                date:"2022-03-16"
            },
            {
                con:"君乐宝是不是玩踩雷游戏了，挺准",
                date:"2022-03-16"
            }
        ],
        con:''
    },
    getcon:function(e){
        console.log(e.detail.value)
        // 获取的表单元素的值赋值给con
        this.setData({
            con:e.detail.value
        })
    },
    send:function(){
        // a.push(b)把b追加到数组a后面
        // 获取数据
        var mylist=this.data.list;
        // 获取当前日期
        var  date= new Date()
        // 获取年份
        var year=date.getFullYear();
        // 获取月份 月份只有0-11月份
        var month=date.getMonth()+1
        // 获取日期
        var d=date.getDate()
        // 小时
        var hours=date.getHours()
        // 分钟
        var minutes=date.getMinutes();
        // 秒
        var seconds=date.getSeconds();
        // 追加数据
        mylist.push({
            con:this.data.con,
            date:year+'-'+month+'-'+d+'  '+hours+':'+minutes+":"+seconds
        })
        // 修改mylist的值
        this.setData({
            list:mylist
        })
    },

3、增加数据和查询数据：

Page({

    /**
     * 页面的初始数据
     */
    data: {
      user:'',
      pass:''
    },
    getuser:function(e){
      this.setData({
        user:e.detail.value
      })
    },
    getpass:function(e){
      this.setData({
        pass:e.detail.value
      })
    },
    add:function(){
        // 初始化
        const db = wx.cloud.database();
        // 增加数据
        // db.collection('集合名字')
        db.collection('student').add({
            // data 字段表示需新增的 JSON 数据
            data: {
              user:this.data.user,
              pass:this.data.pass
            },
            // success成功以后的指令
            success: function(res) {
              // res 是一个对象，其中有 _id 字段标记刚创建的记录的 id
              console.log(res)
            }
          })
    },

    check:function(){
      // 初始化
      const db = wx.cloud.database();
      // 查询语句
      db.collection('student').where({
        user: 'zsh',
        pass:"123"
      })
      .get({
        success: function(res) {
          // 查询结果
          console.log(res.data)
        }
      })
    },

4、视频弹幕制作：

Page({

  /**
   * 页面的初始数据
   */
  data: {
    danmulist:[
      {
        text:'吐槽',
        color:'#ffff00',
        time:1
      },
      {
        text:'今天才周二',
        color:'#00ff00',
        time:2
      },
      {
        text:'今天太热了',
        color:'#00ffff',
        time:2
      }
    ],
    con:''
  },
  getcon:function(e){
    // e.detail.value 获取表单元素的值
    console.log(e.detail.value)
    this.setData({
      con:e.detail.value
    })
  },
  // 发送弹幕
  send:function(){
    this.videoContext.sendDanmu({
      text:this.data.con,
      color:'pink'
    })
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onl oad: function (options) {

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    // 获取视频标签
    this.videoContext = wx.createVideoContext('myVideo')
  },

标签：总结,function,微信,var,setData,date,第一阶段,data,con
来源： https://blog.csdn.net/LR08271/article/details/123611795

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。