微信小程序
冲冲冲
雨兮雨
这个作者很懒,什么都没留下…
展开
-
2-----------案例一
1、初始化2、头部index.wxss/**头部布局**/.header{width:750rpx;height:90rpx;}.hdcon{display:flex;justify-content:space-between;align-items:center;height:100%;}/**两张图片放在一行**/.hdcon navigator,.hdcon .kefu{height:50rpx;}.hdcon image{height:100%;}.kefu{position:re原创 2021-03-09 19:57:15 · 8337 阅读 · 0 评论 -
微信小程序云开发调用 腾讯云AI 图像标签
本白菜在开发微信小程序调用腾讯云AI图像标签产品时,遇到了问题,自己琢磨了三天,搜遍了能搜的东西,还是没有解决。下边记录一下 调用过程1、首先进入https://cloud.tencent.com/document/api/865/35471使用这个在线生成代码2、在云函数目录下的index.js 中// 云函数入口文件const cloud = require('wx-server-sdk')cloud.init({ env: "你的环境变量"})(1)填入环境变量(2)在云函数原创 2021-03-09 12:02:30 · 1224 阅读 · 3 评论 -
23---------------------------------------云开发云存储介绍
1、图片上传到云存储中,并展现在下方.jscloudFile(path){ wx.showLoading({ title: '图片上传中', }) wx.cloud.uploadFile({ cloudPath:Date.now()+".jpg", filePath:path }) .then(res=>{ this.setData({ picUrl:res.fileID })原创 2021-02-28 01:22:16 · 147 阅读 · 0 评论 -
22------------------------------云开发云函数
1、云函数2、云函数const db=cloud.database({ env:"environmentlyl-7g8m55cjcacc768c"})// 云函数入口函数exports.main = async (event, context) => { return await db.collection("demolist").get()}原创 2021-02-26 23:17:03 · 104 阅读 · 0 评论 -
21-------------------------------------云开发点赞自增
自增upData(){ db.collection("demolist") .doc("79550af260376da3070a18c927265d33") .update({ data:{ hits:_.inc(1) } }) },原创 2021-02-26 17:43:21 · 112 阅读 · 0 评论 -
21-------------------------------------------云开发command
https://developers.weixin.qq.com/miniprogram/dev/wxcloud/reference-sdk-api/database/command/Command.lt.htmlconst _ = db.commanddb.collection('todos').where({ progress: _.lt(50)}).get({ success: console.log, fail: console.error})原创 2021-02-26 15:20:29 · 54 阅读 · 0 评论 -
20------------------------云开发各项构建查询条件
1、限制查询3条,按时间顺序排列,如果是倒叙,则将asc改为descgetData(){ db.collection("demolist") .limit(3) .orderBy("time","asc").get() .then(res=>{ console.log(res) }) },云开发->SDK文档->数据库->Collection->构建查询条件2、分页用 .skip(7),从第7条开始返回3、查询指定字段.fi原创 2021-02-26 12:25:40 · 120 阅读 · 0 评论 -
19----------------云开发count个数与watch数据监听
1、count查询记录个数.js//获取记录个数 btnNum(){ db.collection("demolist").count() .then(res=>{ console.log(res) }) },.wxml<button type="primary" bindtap="btnNum">查询个数</button>2、.watch监听,实时更新数据onLoad: function (options) {原创 2021-02-26 11:38:13 · 230 阅读 · 0 评论 -
18------------------------云开发删除数据记录及表单数据收集(记录输入的数据)
1、删除数据delData(){ db.collection("demolist") .doc("28ee4e3e60376a74078a616e7eeec593") .remove() },2、获取输入数据内容.js定义全局变量var myVlu="";myIpt(){ var vlu=res.detail.value; myVlu=vlu }, //删除数据 delData(){ db.collection("demoli.原创 2021-02-26 00:10:14 · 78 阅读 · 0 评论 -
17---------------云开发更新云数据库的两种方法
1、通过id来指定到想要改的数据.jsupdateData(){ db.collection("demolist").doc("1551b00560376b090025278b0c00b69e") .update({ data:{ author:"gyjugmng" } }) },.wxml<button type="primary" bindtap="updateData">更新一条记录</butt原创 2021-02-25 23:55:51 · 520 阅读 · 0 评论 -
16---------------------云开发提交表单添加到云数据库
.js//提交表单添加数据 btnSub(res){ //法一 var {title,author,content}=res.detail.value db.collection("demolist").add({ data:{ title:title, author:author, content:content } }) //法二 var res..原创 2021-02-25 18:00:54 · 170 阅读 · 0 评论 -
15------------------云开发添加数据到云数据库
1、插入一条记录.wxml<button type="primary" bindtap="addData">插入一条数据</button>.jsaddData(){ db.collection("demolist").add({ data:{ title:"测试标题1", author:"张三", content:"测试的内容部分测试的内容部分测试的内容部分测试的内容部分测试的内容部分"原创 2021-02-25 17:24:21 · 86 阅读 · 0 评论 -
14------------------云开发THREE在页面展现云数据库的内容
1、在index.js里设置const db=wx.cloud.database({ env:"environmentlyl-7g8m55cjcacc768c"})/* 连接数据库*/data: { dataObj:"" }, getData(){ db.collection("demolist") .get({ success:res=>{ console.log(res) this.setData(原创 2021-02-25 17:07:28 · 63 阅读 · 0 评论 -
13-------------------------云开发TWO使用云控制台控制数据库
手动在数据库里添加数据原创 2021-02-25 17:07:06 · 78 阅读 · 0 评论 -
12云开发------------------------ONE项目初始化
1、打开miniprogram文件夹2、删掉云函数step1:点进去文件夹step2:删除3、打开组件文件夹直接删除下图文件夹images、style文件夹也直接删除删完后是这个样子4、打开pages文件夹除了index,其余全部删除5、把index里的图片删除删除完结!!6、下边改代码app.json里的只留下index,其余全部删除7、app.wxss里的代码全部删除8、index.wxml里的代码全部删除9、index.wxss里的代码全部删除10原创 2021-02-25 17:06:54 · 112 阅读 · 0 评论 -
12-----------------------通过ES6模块化公共函数
1、在utils下创建.js文件,注意不是文件夹2、在里边编写函数common是一个对象,最后一句话,是将这个对象返回,里边有两个函数。ONE:getStrLen:function(str,len)这个是文章标题超过len个长度,后边就会变成省略号TWO:getMyData:function(timestamp,formats)这个是将时间戳转化为标准日期。var common={ getStrLen:function(str,len){ if(str.length>le原创 2021-02-25 17:06:39 · 185 阅读 · 0 评论 -
11-----------------数据接口,修改时间戳
在.js里onLoad里写1、onLoad: function (options) { //发送网络请求获取真实的行业动态列表 wx.request({ url:'https://ku.qingnian8.com/school/list.php', success:res=>{ console.log(res.data) this.setData({ dataList:res.data }原创 2021-02-25 17:06:28 · 270 阅读 · 0 评论 -
10--------------------内置页面
.wxml<!--PART ONE--><!--头部--><view class="header"> <view class="container hdcon"> <navigator open-type="switchTab" url="/pages/index/index" class="logo"> <image mode="heightFix" src="/images/logo.png">&...原创 2021-02-24 11:18:37 · 229 阅读 · 0 评论 -
9----------------自定义组件
1、创建与page同级的文件夹,自己随便起名2、在Component下方创建文件夹,自定义起名3、在xsj下方 选择 新建 component4、在.wxml中自定义内容,也可以在.wxss中设置样式<view class="box">这是我们自己定义的组件</view>.box{background:pink;}5、在用到改组件的文件的 .json 中加入组件路径{ "usingComponents": { "xsjsx":"/Componen原创 2021-02-24 11:14:04 · 86 阅读 · 0 评论 -
8------------------下方的tabBar导航图
效果图:app.json"tabBar":{ "color":"#B6B6B6", "selectedColor":"#FE9132", "list":[ { "pagePath":"pages/index/index", "text":"首页", "iconPath":"images/home.png", "selectedIconPath":"images/home-h.png" }, {原创 2021-02-24 11:05:10 · 68 阅读 · 0 评论 -
7--------------PART SIX logo
效果图:灰色背景,图片+文字.wxml<!--PART SIX--><!--logo--><view class="footer"> <image class="pic" mode="widthFix" src="/images/logo.png"></image> <view class="txt">-高端实训品牌-</view></view>.wxss/*PART SIX*//*原创 2021-02-24 11:02:37 · 77 阅读 · 0 评论 -
6--------------------PART FIVE 行业动态模块
效果图:.wxml<!--PART FIVE--><!--行业动态模块--><view class="dynamic"> <view class="container"> <view class="pubTitle"> <view class="txt">行业动态</view> <navigator class="more">更多 ></navigator&g原创 2021-02-24 10:59:10 · 65 阅读 · 0 评论 -
5--------------------PARTFOUR学员作品模块
效果图:.wxml<!--PART FOUR--><!--学员作品模块--><view class="works"> <view class="container"> <view class="pubTitle"> <view class="txt">学员作品</view> <navigator class="more">更多 ></navigator>原创 2021-02-24 10:56:50 · 118 阅读 · 0 评论 -
4-------------PART THREE导航滑动模块
效果图:可以左右滑动.wxml<!--PART THREE--><!--导航滑动模块--><scroll-view class="major" scroll-x> <navigator class="box" url="/pages/ps/ps"> <image class="pic" src="/images/kecheng1.png"></image> <view class=原创 2021-02-24 10:54:39 · 91 阅读 · 0 评论 -
2----------------PART-ONE头部
效果图:两个图片,两端对齐,右边的图片有闪动效果.wxml<!--PART ONE--><!--头部--><view class="header"> <view class="container hdcon"> <navigator open-type="switchTab" url="/pages/index/index" class="logo"> <image mode="heightFix" src原创 2021-02-24 10:48:05 · 83 阅读 · 0 评论 -
3-------------------PART TWO轮播图
效果图:几张图片自动循环播放。下边有三个点.wxml<!--PART TWO--><!--轮播图--><view class="banner"> <swiper indicator-dots indicator-color="rgba(255,255,255,0.5)"indicator-active-color="#fff" circular autoplay interval="4000"> <swiper-item>&原创 2021-02-24 10:51:16 · 64 阅读 · 0 评论 -
1-------------基础课程
1、.js,逻辑层;.json配置层;.wxss样式层。ctrl+s编译运行2、创建文件夹news在app.json里,加入语句:{ "pages":[ "pages/index/index", "pages/logs/logs", "pages/news/news"//路径 ],3、图片<image src="https://cn.bing.com/images/search?view=detailV2&ccid=67It原创 2021-02-21 00:21:27 · 654 阅读 · 0 评论