![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
小程序
你的美,让我痴迷
可能性无处不在,只要努力去寻找它们,并且勇敢地去尝试,就会让我们变得更加出色。
展开
-
微信小程序使用echarts/数据刷新重新渲染/图层遮挡问题
使用后,如果需要让图例随数据变化而变化或者重新渲染,可直接使用。在需要使用的wxml和wxss中写好容器的样式代码。最后在js文件中引用并编写图例代码及数据即可。下载好后,在使用页面的json文件中配置。2、图例重新渲染方法。原创 2023-04-19 15:13:25 · 685 阅读 · 0 评论 -
小程序如何获取project.config.json 中的appid
【代码】小程序如何获取project.config.json 中的appid。原创 2023-03-23 12:16:40 · 445 阅读 · 0 评论 -
wxml2Canvas绘制小程序图片
【代码】wxml2Canvas绘制小程序图片。原创 2022-10-08 18:02:37 · 1483 阅读 · 0 评论 -
uniapp 除了数字,其他输入无效
数字限制原创 2022-07-04 17:54:01 · 273 阅读 · 0 评论 -
微信小程序 使用腾讯地图SDK详解及实现步骤
腾讯地图原创 2022-06-06 10:10:01 · 3680 阅读 · 1 评论 -
使用uniapp开发小程序,uniapp更新代码后,在微信开发者工具中不更新代码?
把热重载关了就可以了原创 2022-04-29 10:36:43 · 2187 阅读 · 0 评论 -
uni-app小程序加载页面出现图片拉长再变正常的原因
在使用uniapp写微信小程序的页面样式的时候,你会发现一个现象就是加载图片的时候回先变长然后在正常显示,在pc端和app端没有问题。这个原因是因为图片高度是自适应的,没有给固定高度。解决方案就是给父元素固定宽高,图片设置宽高百分之百或者给图片加一个固定的宽高就解决了...原创 2022-04-19 16:47:16 · 1659 阅读 · 0 评论 -
小程序如何发布体验版本
一、在微信开发者工具中——导航栏——工具——上传上传成功后二、登录微信公众平台点击版本管理 最下方如果要发布到线上 就选择一个要发布的版本 提交审核 就可以了原创 2022-04-18 09:47:35 · 5340 阅读 · 1 评论 -
小程序报错:Uncaught ReferenceError: define is not defined
小程序报错:Uncaught ReferenceError: define is not defined和pages/leftSlide/leftSlide.js 出现脚本错误或者未正确调用 Page()也许是项目设置里面的调试基础库版本过高引起的,调低一点就可以了原创 2022-02-09 19:48:28 · 1566 阅读 · 3 评论 -
云函数调用数据库
// 云函数入口文件const cloud = require('wx-server-sdk')cloud.init({ traceUser:true, evn:"cloud1-8gwin7gd7a4b5686"})const db=cloud.database();// 云函数入口函数//云函数调用数据库exports.main = async (event, context) => { return new Promise((resolve,reject原创 2022-02-05 22:08:17 · 1177 阅读 · 0 评论 -
发送网络请求
// 云函数入口文件const cloud = require('wx-server-sdk');const request = require('request');const url= "https://www.hao123.com/api/citymenu?";cloud.init()// 云函数入口函数exports.main = async (event, context) => { // 发送网络请求 function Promise1(){原创 2022-02-05 22:06:02 · 643 阅读 · 0 评论 -
uni-app onBackPress 小程序 解决方案 uni-app返回
onBackPress 只支持APP和H5 但不支持小程序 ,可以用onUnload生命周期解决,页面销毁的时候执行方法。原创 2021-09-29 09:39:13 · 1183 阅读 · 0 评论 -
从小程序跳转到另一个小程序
wx.navigateToMiniProgram({ appId: baseurl.appid, //要打开的小程序appid path: url, //要打开另一个小程序的页面和传递的参数 envVersion: 'release', //打开小程序的版本(体验版trial;开发版develop;正式版release) success(res) { //··//打开成功之后事件 .原创 2021-09-24 11:37:23 · 278 阅读 · 0 评论 -
uniapp获取手机号流程
1`. view视图代码<button class=“allow-btn” open-type=“getPhoneNumber” @getphonenumber=“getphonenumber”>允许`js代码getphonenumber(e) { this.$emit('getphonenumber',e); console.log(e,"获取手机号信息"); console.log(e.detail.errMsg); console.log(e.de原创 2021-09-20 12:38:27 · 3298 阅读 · 2 评论 -
小程序navigateToMiniProgramAppIdList配置
在app.json文件中新增配置项{ "cloud": true, "pages": [ "pages/index/index", "pages/userConsole/userConsole", "pages/storageConsole/storageConsole", "pages/databaseGuide/databaseGuide", "pages/addFunction/addFunction", "pages/deployFuncti原创 2021-09-09 14:10:00 · 2780 阅读 · 0 评论 -
小程序的分享 onShareAppMessage(options)
onShareAppMessage: function( options ){ var that = this; // 设置菜单中的转发按钮触发转发事件时的转发内容 var shareObj = { title: "转发的标题", // 默认是小程序的名称(可以写slogan等) path: '/pages/share/share', // 默认是当前页面,必须是以‘/’开头的完整路径 imageUrl: '', //自定义图片路径,可原创 2021-08-10 09:37:06 · 402 阅读 · 0 评论 -
微信开发者工具获取小程序指定页面路径
原创 2021-07-19 11:31:18 · 906 阅读 · 0 评论 -
uni-app 微信小程序设置全局的分享onShareAppMessage
创建一个 mixins ,我的文件路径为 : common/share.jsexport default { onShareAppMessage(res) { //发送给朋友 return {} }, onShareTimeline(res) {//分享到朋友圈 return {} },}或export default { created() { //#ifdef MP-WEIXIN wx.sh原创 2021-05-08 14:39:14 · 3588 阅读 · 2 评论 -
uni-app定义图片轮播组件
<template> <view class="content"> <swiper class="lunbotu" circular="index" autoplay="true"> <swiper-item v-for="(i, index) in lunboList" :key="index"><image :src="i" class="banner_img"></image></swiper-item>原创 2021-04-08 17:09:03 · 600 阅读 · 0 评论 -
uni-app中引入组件、css样式以及js文件的方法
引入组件 import uniSearchBar from '@/components/uni-search-bar/uni-search-bar.vue' import yuToast from '@/components/yu-toast/yu-toast' import luchAudio from '@/components/luch-audio/luch-audio.vue' export default { components: { uniSearchBar, y原创 2021-03-26 13:23:19 · 3104 阅读 · 0 评论 -
uni-app 渐变
基础线性渐变,从上到下background: linear-gradient(blue, pink);改变渐变方向background: linear-gradient(to right, blue, pink);对角线渐变background: linear-gradient(to bottom right, blue, pink);设置渐变角度background: linear-gradient(70deg, blue, pink);...原创 2021-03-26 00:21:35 · 2244 阅读 · 0 评论 -
小程序获取用户信息
// 获取用户信息 wx.getSetting({ success: res => { console.log("用户授权信息:",res); if (res.authSetting['scope.userInfo']) { // 已经授权,可以直接调用 getUserInfo 获取头像昵称,不会弹框 console.log("用户已经授权"); wx.getUserInfo({ .原创 2021-02-04 15:37:33 · 286 阅读 · 0 评论 -
小程序购物车的实现
wxml:<!--pages/myCart/myCart.wxml--><block wx:for="{{list}}" wx:key="index"> <view data-index='{{index}}' class="list {{item.active?'touch-move':''}}" bindtap="demo" bindtouchstart="touchStart" bindtouchmove="touchMove" > <原创 2021-02-04 15:35:50 · 553 阅读 · 0 评论 -
小程序封装网络请求
/** * * @param {string 请求的方式 get/post} method * @param {发送的参数} params * @param {请求的接口地址} url * @param {信息弹窗交互数据} message * @param {成功的回调函数} callback * @param {失败的回调函数} error */function http(method,params,url,message,callback,error){原创 2021-02-02 18:14:28 · 126 阅读 · 0 评论 -
小程序实现城市搜索功能
wxml:<view class="location">推荐</view> <button class="getLocation" bindtap="getLocation" size='mini'>定位</button> <view class="hotCity">热门城市</view><block wx:for="{{hotCitys}}" wx:key="index"> <button cla原创 2021-02-02 17:08:09 · 496 阅读 · 1 评论 -
小程序获取定位位置
wxml:<view class="location">推荐</view> <button class="getLocation" bindtap="getLocation" size='mini'>定位</button> <view class="hotCity">热门城市</view> <button class="btn" size="mini" wx:for="{{hotCitys}}" wx:key="原创 2021-02-01 13:36:05 · 443 阅读 · 0 评论 -
小程序实现分类
wxml:<view class="navBar"> <view class="item" wx:for="{{navBarArr}}" wx:key='index'> <image src="../../images/{{item.image}}"></image> <view>{{item.name}}</view> </view> </view>wxss原创 2021-01-30 17:05:15 · 614 阅读 · 0 评论 -
小程序设置文本内容样式
.desc{ color: #666; line-height: 34rpx; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:3 ; -webkit-box-orient: vertical;}效果设置:原创 2021-01-30 13:53:35 · 696 阅读 · 0 评论 -
小程序动态设置标题
//动态设置当前页面的标题 wx.setNavigationBarTitle({ title:objInfo[options.id].title , })效果:原创 2021-01-30 13:51:30 · 180 阅读 · 0 评论 -
小程序滑块视图容器做一个好看的界面
<!--index.wxml--> <view class="banner"> <swiper indicator-active-color="#43bf92" indicator-color="white" interval="3000" autoplay="true" circular="true" bindchange="swiperChange" > <swiper-item wx:for="{{bannerArr}原创 2021-01-29 19:26:12 · 165 阅读 · 0 评论 -
小程序模板传递信息
<!-- 引入模板 --> <import src="../productList/productList.wxml"></import><!-- 模板传递数据 --><!-- <block wx:for="{{listArr}}" wx:key="index" wx:for-item="obj"> <template is='productList' data="{{obj}}"></template.原创 2021-01-28 17:18:14 · 188 阅读 · 0 评论 -
小程序引入外部的js文件
function demo(){ console.log('公共的js文件——————模板')}var obj={ uname:'lilei', age:20}//想法外部使用js文件模块,必须暴露出接口//方法1:直接暴露出内容变量//module.exports=demo;//方法2:暴露给变量={}//module.exports.aa=demo;//module.exports.obj=obj;//方法3:module.exports={ aa:de原创 2021-01-28 16:25:18 · 1040 阅读 · 0 评论 -
小程序使用模板
使用模板: <!-- 引入模板 --> <import src="../productList/productList.wxml"></import> <!-- 使用模板语法: <template is='模板名字' ></template>说明:1:template 双标签 里面不能写内容 不显示2:单标签 <template is='prouductList></template>'3:te原创 2021-01-28 16:21:15 · 191 阅读 · 0 评论 -
小程序if语句的使用
<view wx:if="{{len>5}}">值1</view><view wx:elif="{{len>3}}">值2</view><view wx:else>值3</view>data: { arr:[1,2,3,4,5,78,'word','hello'], len:6 },效果:原创 2021-01-28 14:37:20 · 1473 阅读 · 0 评论 -
小程序for循环的运用
js设置: data: { arr:[1,2,3,4,5,78,'word','hello'] },wxml:<view wx:for="{{arr}}" wx:key='index'>{{index}}------{{item}}</view>输出效果:原创 2021-01-28 14:20:43 · 1108 阅读 · 0 评论 -
小程序导航的使用
<!-- 返回 --><navigator open-type="navigateBack">返回</navigator><!--导航:小程序跳转方式I navigator : ur1=""跳转的地址 页面的后缀省略,open-type=""跳转方式--[open-type='navigateTo'保留当前页面,跳转到应用内的某个页面。但是不能跳到tabbar 页面默认属性--> <navigator url='../newsDeta.原创 2021-01-27 17:56:09 · 164 阅读 · 0 评论 -
小程序按钮的使用
<button size="mini" type="primary">按钮</button><button size="mini" type="warn">按钮</button><button open-type="share">按钮</button><button>按钮</button>原创 2021-01-27 17:19:58 · 201 阅读 · 0 评论 -
小程序滚动条的使用
<view> <progress percent="10"></progress> <progress percent="20" show-info="true"></progress> <progress percent="50" show-info="true"></progress> <progress percent="80" active="true" border-radius原创 2021-01-27 17:08:49 · 164 阅读 · 0 评论 -
小程序图标的使用
<icon type="success"></icon><icon type="success_no_circle"></icon><icon type="info"></icon><icon type="warn"></icon><icon type="waiting"></icon><icon type="cancel"></icon><ico原创 2021-01-27 16:54:34 · 138 阅读 · 0 评论 -
小程序可滚动视图区域的使用
<scroll-view class="tab" scroll-x="true"> <text>新闻1</text> <text>新闻2</text> <text>新闻3</text> <text>新闻4</text> <text>新闻5</text> <text>新闻6</text> <text>新闻7<原创 2021-01-27 16:38:11 · 110 阅读 · 0 评论