mp-html富文本渲染插件
摘要：<template> <mp-html :content="html"></mp-html> </template> <script setup> const html = '<div>123<h1>5555</h1></div>' </script> <style scoped lang="scs
阅读全文
posted @ 2025-03-05 11:27
随笔分类 - uniapp
分享朋友圈、分享小程序
摘要：<template> <view class="">123</view> </template> <script setup> // 打开分享功能 onShareAppMessage((e) => { return { title: '自定义分享标题', path: '/pages/demo/ima
阅读全文
posted @ 2025-03-05 01:33
小程序存储图片到相册getImageInfo、saveImageToPhotosAlbum、openSetting
摘要：1.配置download地址 2.配置隐私协议 3.模拟器清除授权 4.代码 <template> </template> <script setup> // 实现储存网络图片到相册 // #ifdef H5 // H5无法实现，只能弹出图片让用户截图或者长按保存图片 // #endif // #i
阅读全文
posted @ 2025-03-05 00:22
设备顶部信息uni.getSystemInfoSync()、uni.getMenuButtonBoundingClientRect()
摘要：<template> </template> <script setup> // 实现隐藏顶部导航Bar，自己模拟实现左上角返回按钮，可根据下面的数据写出与右上角收藏和退出区域平行的高度 // 获取不同设备的信息 let SYSTEM_INFO = uni.getSystemInfoSync() /
阅读全文
posted @ 2025-03-04 00:55
uni-popup、uni-rate
摘要：<template> <button @click="open">打开弹窗组件</button> <uni-popup ref="popup" type="bottom" background-color="#fff"> <view style="height: 300rpx;"> 评分组件 <un
阅读全文
posted @ 2025-03-03 23:18
条件编译#ifdef
摘要：<template> MP是指代所有小程序 ifdef 只在MP设备会编译代码块里面的代码 <!-- #ifdef MP --> <button open-type="contact">点击会直接打开微信小程序后台配置的客服聊天，h5不生效</button> <!-- #endif --> ifnd
阅读全文
posted @ 2025-03-03 15:56
磨砂效果、fit-content
摘要：backdrop-filter: blur(10px); width:fit-content // 自适应内容的宽度
阅读全文
posted @ 2025-03-03 14:09
uni-扩展组件
摘要：官方提供的组件包，直接下载安装按需导入即可 loading示例 <template> <view class="" v-for="item in 50">{{item}}</view> <text>当前页面无数据时显示loading</text> <text>把数据下划到最下，下划时显示loadin
阅读全文
posted @ 2025-03-03 00:36
pageScrollTo、env(safe-area-inset-bottom)
摘要：<template> <view class="" v-for="item in 50">{{item}}</view> <button @click="back">回到顶部</button> <view class="v">11</view> </template> <script setup>
阅读全文
posted @ 2025-03-02 15:10
api调用下拉刷新和关闭startPullDownRefresh、stopPullDownRefresh
摘要：<template> <button @click="fresh">api调用下拉刷新</button> <button @click="stop">api关闭下拉刷新</button> </template> <script setup> const fresh = () => { uni.sta
阅读全文
posted @ 2025-03-02 14:39
图片懒加载lazy-load，图片预览previewImage、小程序本地开发https配置和上线配置
摘要：<template> imge自带懒加载功能啊，只针对page与scroll-view下的image有效并且是小程序有效 <image :src="item.url" mode="" v-for="(item,index) in data" lazy-load @click="preview(ind
阅读全文
posted @ 2025-03-02 13:29
request
摘要：<template> <text>{{data}}</text> </template> <script setup> import { ref } from 'vue'; const data = ref([]) // 代替axios了，返回的是一个promise const init = asy
阅读全文
posted @ 2025-03-01 22:52
setStorageSync、getStorageSync、removeStorageSync、clearStorageSync
摘要：<template> <text>{{getStorage}}</text> </template> <script setup> // 一般使用Sync同步的api // 设置localStorage uni.setStorageSync('key', '我是存的数据') // 获取localSt
阅读全文
posted @ 2025-03-01 22:24
navigateTo、relaunch、navigateBack、getCurrentPages
摘要：<template> <button @click="show">跳1</button> <button @click="hide">跳2</button> <button @click="back">回退</button> </template> <script setup> // 使用js代码跳
阅读全文
posted @ 2025-03-01 18:54
setTabBarItem、setTabBarStyle、showTabBar、hideTabBar、setTabBarBadge、removeTabBarBadge、showTabBarRedDot、hideTabBarRedDot
摘要：<template> <!-- <button @click="show">显示</button> <button @click="hide">隐藏</button> --> </template> <script setup> // 设置下面的tabbar的配置 uni.setTabBarItem
阅读全文
posted @ 2025-03-01 17:18
setNavigationBarTitle、setNavigationBarColor、showNavigationBarLoading、hideNavigationBarLoading、hideHomeButton
摘要：<template> <button @click="show">显示</button> <button @click="hide">隐藏</button> <view class=""> <navigator url="/pages/demo/rpx">跳</navigator> </view>
阅读全文
posted @ 2025-03-01 15:25
showActionSheet
摘要：<template> <button @click="show">显示</button> </template> <script setup> const arr = ['A','B','C'] const show = () => { // 下面弹出来的选项 uni.showActionSheet
阅读全文
posted @ 2025-03-01 14:32
showModal、showLoading、hideLoading
摘要：<template> <button @click="show">显示</button> <button @click="hide">隐藏</button> <button @click="deleteMsg">删除</button> </template> <script setup> const
阅读全文
posted @ 2025-03-01 00:03
showToast、hideToast
摘要：<template> <button @click="show">显示</button> <button @click="hide">隐藏</button> </template> <script setup> const show = () => { uni.showToast({ duratio
阅读全文
posted @ 2025-02-28 23:30
uniapp auto-import
摘要：1.安装 npm i unplugin-auto-import 2.创建vite.config.js，并配置 import { defineConfig } from 'vite' import uni from '@dcloudio/vite-plugin-uni' import AutoImpo
阅读全文
posted @ 2025-02-28 18:11
