CINXE.COM

<!DOCTYPE html> <html lang="cn"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>store-product | 微信开放文档</title> <meta name="description" content="微信开发者平台文档"> <meta name="msapplication-TileColor" content="#ffffff"> <meta name="theme-color" content="#ffffff"> <meta name="keywords" content="微信官方文档"> <link rel="shortcut icon" type="image/x-icon" href="https://res.wx.qq.com/a/wx_fed/assets/res/NTI4MWU5.ico"> <link rel="mask-icon" color="#4C4C4C" href="https://res.wx.qq.com/a/wx_fed/assets/res/MjliNWVm.svg"> <link rel="apple-touch-icon-precomposed" href="https://res.wx.qq.com/a/wx_fed/assets/res/OTE0YTAw.png"> <script> (function () { 'use strict'; const SCRIPT_URLs = [ 'https://dldir1.qq.com/WechatWebDev/devPlatform/px.min.js', 'https://dev.weixin.qq.com/platform-console/proxy/assets/tel/px.min.js', ]; const param = { maskMode: 'no-mask', // 隐私策略, all-mask 或 no-mask, 详见：https://dev.weixin.qq.com/docs/analysis/sdk/docs.html recordCanvas: false, // 若要采集canvas, 设为true projectId: 'wxef34f91ddab0c534-0HLdQNKAk-dzsFsA', // 项目 ID，需替换为体验分析项目 ID iframe: false, // 是否采集 iframe 页面 console: true, // 是否采集 console 输出的错误日志 network: true, // 是否采集网络错误 }; function loadScript(url) { return new Promise((resolve, reject) => { const scriptEle = document.createElement('script'); scriptEle.type = 'text/javascript'; scriptEle.async = true; scriptEle.src = url; scriptEle.onload = () => { resolve(url); }; scriptEle.onerror = () => { reject(new Error('Script load error')); }; document.head.appendChild(scriptEle); }); } async function main() { try { sessionStorage.setItem('wxobs_start_timestamp', String(Date.now())); const fastestUrl = await Promise.race(SCRIPT_URLs.map(url => loadScript(url))); window.__startPX && window.__startPX(param); } catch (error) { console.error('Error loading scripts:', error); } } main(); })(); </script> <link rel="preload" href="https://res.wx.qq.com/wxdoc/dist/assets/css/0.styles.d7e6e1b8.css" as="style"><link rel="preload" href="https://res.wx.qq.com/wxdoc/dist/assets/js/app.6ab6bfc0.js" as="script"><link rel="preload" href="https://res.wx.qq.com/wxdoc/dist/assets/js/2134.c02cbf88.js" as="script"> <link rel="stylesheet" href="https://res.wx.qq.com/wxdoc/dist/assets/css/0.styles.d7e6e1b8.css"> </head> <body> <div id="app" data-server-rendered="true"><div class="theme-container"><div class="theme-container"><header class="navbar navbar_with-link"><div class="navbar__left"><a href="/doc/" class="home-link"><div class="logo__wrp"><span class="logo__icon"></span></div></a> <span class="dot"></span> <div class="dropdown-wrapper"><a class="dropdown-title"><span class="title">小程序</span> <span class="arrow right"></span></a> <ul class="nav-dropdown" style="display:none;"><li class="dropdown-item selected"> <a href="/miniprogram/dev/framework/" class="nav-link external"> 小程序 </a></li><li class="dropdown-item"> <a href="/minigame/introduction/" class="nav-link external"> 小游戏 </a></li><li class="dropdown-item"> <a href="/doc/offiaccount/Getting_Started/Overview.html" class="nav-link external"> 公众号 </a></li><li class="dropdown-item"> <a href="/doc/aispeech/platform/INTRODUCTION.html" class="nav-link external"> 智能对话 </a></li><li class="dropdown-item"> <a href="/doc/oplatform/Third-party_Platforms/2.0/getting_started/terminology_introduce.html" class="nav-link external"> 开放平台 </a></li><li class="dropdown-item"> <a href="https://work.weixin.qq.com/api/doc" class="nav-link external"> 企业微信 </a></li><li class="dropdown-item"> <a href="https://pay.weixin.qq.com/doc/v3/merchant/4012062524" class="nav-link external"> 微信支付 </a></li><li class="dropdown-item"> <a href="/doc/channels/Operational_Guidelines/Shop_opening_guidelines.html" class="nav-link external"> 视频号 </a></li><li class="dropdown-item selected"> <a href="/doc/store/API/basics/ChangeLog.html" class="nav-link external"> 微信小店 </a></li><li class="dropdown-item"> <a href="/doc/xwei/xiaowei-introduction/Introduction.html" class="nav-link external"> 腾讯小微 </a></li><li class="dropdown-item"> <a href="/doc/ministore/minishopquickstart/introduction.html" class="nav-link external"> 小商店 </a></li></ul></div></div> <div class="navbar__center"><nav class="nav-links"><div class="nav-item selected"><a href="/miniprogram/dev/framework/" class="nav-link external"> 开发 </a></div><div class="nav-item"><a href="/miniprogram/introduction/" class="nav-link external"> 介绍 </a></div><div class="nav-item"><a href="/miniprogram/design/" class="nav-link external"> 设计 </a></div><div class="nav-item"><a href="/miniprogram/product/" class="nav-link external"> 运营 </a></div><div class="nav-item"><a href="/miniprogram/analysis/wedata/intro/" class="nav-link external"> 数据 </a></div><div class="nav-item"><a href="/miniprogram/security/basic/" class="nav-link external"> 安全 </a></div></nav></div> <div class="navbar__right"><nav class="nav-links"><div class="nav-item community-item"><a href="https://developers.weixin.qq.com/community/develop/mixflow" target="_blank" class="nav-link external"> 社区 </a></div><div class="nav-item community-item"><a href="https://developers.weixin.qq.com/community/business" target="_blank" class="nav-link external"> 学堂 </a></div></nav> <ul class="lang-tab"><li class="lang-tab__icon"><img src="https://res.wx.qq.com/t/components/icons/base/translate_regular.svg"></li></ul> <div class="search__wrp-flex"><div class="search__input"><div class="weui-desktop-search"><button class="weui-desktop-icon-btn weui-desktop-search__btn weui-desktop-icon-btn__width"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M15.4529 16.4014C14.2428 17.4001 12.6915 18 11 18C7.134 18 4 14.866 4 11C4 7.134 7.134 4 11 4C14.866 4 18 7.134 18 11C18 12.7425 17.3633 14.3363 16.3099 15.5614L20.4243 19.6757L19.5757 20.5243L15.4529 16.4014ZM16.8 11C16.8 14.2033 14.2033 16.8 11 16.8C7.79674 16.8 5.2 14.2033 5.2 11C5.2 7.79676 7.79674 5.20001 11 5.20001C14.2033 5.20001 16.8 7.79676 16.8 11Z" fill="black"></path></svg></button></div> <a href="javascript:;" class="search-back__btn">取消</a></div> <div class="reco-list__wrp" style="display:none;"><ul class="reco__list"></ul> <div class="show-more"><a href="/doc/search?source=more&query=&doc_type=miniprogram&jumpbackUrl=%2Fdoc%2F" class="reco-item__link">查看更多 </a></div></div> <div class="reco-list__wrp" style="display:none;"><div class="show-more"><a href="/doc/search?source=more&query=&doc_type=miniprogram&jumpbackUrl=%2Fdoc%2F" class="reco-item__link">在小程序下暂无结果，查看其它业务相关内容 > </a></div></div></div></div></header> <div class="subnavbar"><ul class="subnavbar__list"><li class="subnavbar__item" style="display:;"><div class="dropdown-subnavbar-title"><a href="/miniprogram/dev/framework/" target="_self"> 指南 </a> </div> </li><li class="subnavbar__item" style="display:;"><div class="dropdown-subnavbar-title"><a href="/miniprogram/dev/reference/" target="_self"> 框架 </a> </div> </li><li class="subnavbar__item selected" style="display:;"><div class="dropdown-subnavbar-title"><a href="/miniprogram/dev/component/" target="_self" class="router-link-active"> 组件 </a> </div> </li><li class="subnavbar__item" style="display:;"><div class="dropdown-subnavbar-title"><a href="/miniprogram/dev/api/" target="_self"> API </a> </div> </li><li class="subnavbar__item" style="display:;"><div class="dropdown-subnavbar-title"><a href="/miniprogram/dev/OpenApiDoc/" target="_self"> 服务端 </a> </div> </li><li class="subnavbar__item dropdown-subnavbar" style="display:;"><div class="dropdown-subnavbar-title"><a>平台能力</a> <span class="arrow right dropdown-subnavbar-select"></span></div> <ul class="dropdown-subnavbar-ul"><li class="dropdown-item" style="display:;"><a href="/miniprogram/dev/platform-capabilities/industry/" target="_self" class="nav-link external"> 行业能力 </a></li><li class="dropdown-item" style="display:;"><a href="/miniprogram/dev/platform-capabilities/business-capabilities/" target="_self" class="nav-link external"> 商业能力 </a></li><li class="dropdown-item" style="display:;"><a href="/miniprogram/dev/platform-capabilities/miniapp/" target="_self" class="nav-link external"> 多端能力 </a></li><li class="dropdown-item" style="display:;"><a href="/miniprogram/dev/platform-capabilities/service-market/" target="_self" class="nav-link external"> 服务市场 </a></li><li class="dropdown-item" style="display:;"><a href="/miniprogram/dev/platform-capabilities/cityservice/" target="_self" class="nav-link external"> 城市服务 </a></li><li class="dropdown-item" style="display:;"><a href="/miniprogram/dev/platform-capabilities/charge/" target="_self" class="nav-link external"> 付费能力 </a></li><li class="dropdown-item" style="display:;"><a href="/miniprogram/dev/platform-capabilities/extended/" target="_self" class="nav-link external"> 拓展能力 </a></li></ul></li><li class="subnavbar__item" style="display:;"><div class="dropdown-subnavbar-title"><a href="/miniprogram/dev/devtools/devtools" target="_self"> 工具 </a> </div> </li><li class="subnavbar__item dropdown-subnavbar" style="display:;"><div class="dropdown-subnavbar-title"><a>云服务</a> <span class="arrow right dropdown-subnavbar-select"></span></div> <ul class="dropdown-subnavbar-ul"><li class="dropdown-item" style="display:;"><a href="/miniprogram/dev/wxcloudservice/wxcloud/basis/getting-started" target="_self" class="nav-link external"> 云开发 </a></li><li class="dropdown-item" style="display:;"><a href="/miniprogram/dev/wxcloudservice/wxcloudrun/src/" target="_self" class="nav-link external"> 云托管 </a></li></ul></li><li class="subnavbar__item" style="display:;"><div class="dropdown-subnavbar-title"><a href="/miniprogram/dev/framework/release/" target="_self"> 更新日志 </a> </div> </li></ul></div> <div class="mobile-links__wrp"><div class="mobile-links_mobile"><a href="javascript:;" class="mobile-links__btn">开发</a></div> <div class="mobile-links__panel"><div class="links-panel__bd"><nav class="nav-links"><div class="nav-item selected"><a href="/miniprogram/dev/framework/" class="nav-link external"> 开发 </a></div><div class="nav-item"><a href="/miniprogram/introduction/" class="nav-link external"> 介绍 </a></div><div class="nav-item"><a href="/miniprogram/design/" class="nav-link external"> 设计 </a></div><div class="nav-item"><a href="/miniprogram/product/" class="nav-link external"> 运营 </a></div><div class="nav-item"><a href="/miniprogram/analysis/wedata/intro/" class="nav-link external"> 数据 </a></div><div class="nav-item"><a href="/miniprogram/security/basic/" class="nav-link external"> 安全 </a></div></nav></div> <div class="links-panel__ft"><ul class="lang-tab"><li class="lang-tab__icon"><img src="https://res.wx.qq.com/t/components/icons/base/translate_regular.svg"></li></ul></div></div> <div><div class="weui-mask" style="display:none;"></div> <div class="weui-actionsheet "> <div class="weui-actionsheet__menu"><div class="weui-actionsheet__cell">中文</div><div class="weui-actionsheet__cell">EN</div></div> <div class="weui-actionsheet__action"><div class="weui-actionsheet__cell">取消</div></div></div></div></div> <a href="javascript:;" class="mobile-search-btn"></a> <div class="main-container" style="margin-top:144px;"><div class="main-contontaier__bd" style="min-height:0px;"><div class="sidebar__wrp"><div class="sidebar-cell_mobile"><li class="subnavbar__item selected"><a href="javascript:;" target="_self">组件</a></li></div> <aside class="sidebar" style="top:144px;"> <div class="TreeNavigation"><div class="NavigationLevel NavigationLevel--level-0"><ul><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-1"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/cover-image.html" class="NavigationItem__router-link"> 视图容器 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/cover-image.html" class="NavigationItem__router-link"> cover-image </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/cover-view.html" class="NavigationItem__router-link"> cover-view </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/match-media.html" class="NavigationItem__router-link"> match-media </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/movable-area.html" class="NavigationItem__router-link"> movable-area </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/movable-view.html" class="NavigationItem__router-link"> movable-view </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/page-container.html" class="NavigationItem__router-link"> page-container </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/root-portal.html" class="NavigationItem__router-link"> root-portal </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/scroll-view.html" class="NavigationItem__router-link"> scroll-view </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/swiper.html" class="NavigationItem__router-link"> swiper </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/swiper-item.html" class="NavigationItem__router-link"> swiper-item </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/view.html" class="NavigationItem__router-link"> view </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-1"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/icon.html" class="NavigationItem__router-link"> 基础内容 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/icon.html" class="NavigationItem__router-link"> icon </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/progress.html" class="NavigationItem__router-link"> progress </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/rich-text.html" class="NavigationItem__router-link"> rich-text </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/selection.html" class="NavigationItem__router-link"> selection </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/text.html" class="NavigationItem__router-link"> text </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-1"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/button.html" class="NavigationItem__router-link"> 表单组件 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/button.html" class="NavigationItem__router-link"> button </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/checkbox.html" class="NavigationItem__router-link"> checkbox </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/checkbox-group.html" class="NavigationItem__router-link"> checkbox-group </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/editor.html" class="NavigationItem__router-link"> editor </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/form.html" class="NavigationItem__router-link"> form </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/input.html" class="NavigationItem__router-link"> input </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/keyboard-accessory.html" class="NavigationItem__router-link"> keyboard-accessory </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/label.html" class="NavigationItem__router-link"> label </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/picker.html" class="NavigationItem__router-link"> picker </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/picker-view.html" class="NavigationItem__router-link"> picker-view </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/picker-view-column.html" class="NavigationItem__router-link"> picker-view-column </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/radio.html" class="NavigationItem__router-link"> radio </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/radio-group.html" class="NavigationItem__router-link"> radio-group </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/slider.html" class="NavigationItem__router-link"> slider </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/switch.html" class="NavigationItem__router-link"> switch </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/textarea.html" class="NavigationItem__router-link"> textarea </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-1"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/double-tap-gesture-handler.html" class="NavigationItem__router-link"> Skyline </a>  </span></div> <ul class="NavigationLevel__children"><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-2"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/double-tap-gesture-handler.html" class="NavigationItem__router-link"> 手势系统 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/double-tap-gesture-handler.html" class="NavigationItem__router-link"> double-tap-gesture-handler </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/force-press-gesture-handler.html" class="NavigationItem__router-link"> force-press-gesture-handler </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/horizontal-drag-gesture-handler.html" class="NavigationItem__router-link"> horizontal-drag-gesture-handler </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/long-press-gesture-handler.html" class="NavigationItem__router-link"> long-press-gesture-handler </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/pan-gesture-handler.html" class="NavigationItem__router-link"> pan-gesture-handler </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/scale-gesture-handler.html" class="NavigationItem__router-link"> scale-gesture-handler </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/tap-gesture-handler.html" class="NavigationItem__router-link"> tap-gesture-handler </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/vertical-drag-gesture-handler.html" class="NavigationItem__router-link"> vertical-drag-gesture-handler </a>  </span></li></ul></div></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/draggable-sheet.html" class="NavigationItem__router-link"> draggable-sheet </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/grid-builder.html" class="NavigationItem__router-link"> grid-builder </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/grid-view.html" class="NavigationItem__router-link"> grid-view </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/list-builder.html" class="NavigationItem__router-link"> list-builder </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/list-view.html" class="NavigationItem__router-link"> list-view </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/nested-scroll-body.html" class="NavigationItem__router-link"> nested-scroll-body </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/nested-scroll-header.html" class="NavigationItem__router-link"> nested-scroll-header </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/open-container.html" class="NavigationItem__router-link"> open-container </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/share-element.html" class="NavigationItem__router-link"> share-element </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/snapshot.html" class="NavigationItem__router-link"> snapshot </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/span.html" class="NavigationItem__router-link"> span </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/sticky-header.html" class="NavigationItem__router-link"> sticky-header </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/sticky-section.html" class="NavigationItem__router-link"> sticky-section </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-1"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/functional-page-navigator.html" class="NavigationItem__router-link"> 导航 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/functional-page-navigator.html" class="NavigationItem__router-link"> functional-page-navigator </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/navigator.html" class="NavigationItem__router-link"> navigator </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-1"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/audio.html" class="NavigationItem__router-link"> 媒体组件 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/audio.html" class="NavigationItem__router-link"> audio </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/camera.html" class="NavigationItem__router-link"> camera </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/channel-live.html" class="NavigationItem__router-link"> channel-live </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/channel-video.html" class="NavigationItem__router-link"> channel-video </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/image.html" class="NavigationItem__router-link"> image </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/live-player.html" class="NavigationItem__router-link"> live-player </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/live-pusher.html" class="NavigationItem__router-link"> live-pusher </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/video.html" class="NavigationItem__router-link"> video </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/voip-room.html" class="NavigationItem__router-link"> voip-room </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-1"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/map.html" class="NavigationItem__router-link"> 地图 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/map.html" class="NavigationItem__router-link"> map </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-1"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/canvas.html" class="NavigationItem__router-link"> 画布 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/canvas.html" class="NavigationItem__router-link"> canvas </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-1"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/ad.html" class="NavigationItem__router-link"> 开放能力 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/ad.html" class="NavigationItem__router-link"> ad </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/ad-custom.html" class="NavigationItem__router-link"> ad-custom </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/official-account.html" class="NavigationItem__router-link"> official-account </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/open-data.html" class="NavigationItem__router-link"> open-data </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/store-home.html" class="NavigationItem__router-link"> store-home </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/store-product.html" aria-current="page" class="NavigationItem__router-link router-link-exact-active router-link-active"> store-product </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/web-view.html" class="NavigationItem__router-link"> web-view </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-1"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/native-component.html" class="NavigationItem__router-link"> 原生组件说明 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/native-component.html" class="NavigationItem__router-link"> native-component </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-1"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/aria-component.html" class="NavigationItem__router-link"> 无障碍访问 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/aria-component.html" class="NavigationItem__router-link"> aria-component </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-1"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/navigation-bar.html" class="NavigationItem__router-link"> 导航栏 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/navigation-bar.html" class="NavigationItem__router-link"> navigation-bar </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-1"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/page-meta.html" class="NavigationItem__router-link"> 页面属性配置节点 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/page-meta.html" class="NavigationItem__router-link"> page-meta </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-1"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/overview/" class="NavigationItem__router-link"> XR-FRAME </a>  </span></div> <ul class="NavigationLevel__children"><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-2"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/overview/" class="NavigationItem__router-link"> 概述 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/overview/#概述" class="NavigationItem__router-link"> 概述 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/overview/#特性" class="NavigationItem__router-link"> 特性 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/overview/#示例" class="NavigationItem__router-link"> 示例 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/overview/#限制和展望" class="NavigationItem__router-link"> 限制和展望 </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-2"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/core/" class="NavigationItem__router-link"> 核心 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/core/" class="NavigationItem__router-link"> 架构(ECS) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/core/component.html" class="NavigationItem__router-link"> 组件(Component) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/core/data-values.html" class="NavigationItem__router-link"> 组件数据解析(DataParse) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/core/element.html" class="NavigationItem__router-link"> 元素(Element) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/core/event.html" class="NavigationItem__router-link"> 事件(Event) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/core/scene.html" class="NavigationItem__router-link"> 场景(Scene) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/core/node.html" class="NavigationItem__router-link"> 节点(Node) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/core/node.html#可见性与图层" class="NavigationItem__router-link"> 可见性与图层(Visible&Layer) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/core/shadow.html" class="NavigationItem__router-link"> Shadow元素(ShadowElement) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/core/slot.html" class="NavigationItem__router-link"> Slot </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-2"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/assets/" class="NavigationItem__router-link"> 资源 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/assets/" class="NavigationItem__router-link"> 资源系统(AssetsSystem) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/assets/loader.html" class="NavigationItem__router-link"> 资源加载器(AssetLoader) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/assets/elements.html" class="NavigationItem__router-link"> 资源加载元素(AssetLoad) </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-2"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/" class="NavigationItem__router-link"> 渲染 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/" class="NavigationItem__router-link"> 渲染系统(RenderSystem) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/#画布透明配置" class="NavigationItem__router-link"> 画布透明配置(Alpha) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/geometry.html" class="NavigationItem__router-link"> 几何数据(Geometry) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/effect.html" class="NavigationItem__router-link"> 效果(Effect) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/material.html" class="NavigationItem__router-link"> 材质(Material) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/mesh.html" class="NavigationItem__router-link"> 网格(Mesh) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/texture.html" class="NavigationItem__router-link"> 纹理和图像(Texture) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/texture.html#立方体纹理" class="NavigationItem__router-link"> 立方体纹理(CubeTexture) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/texture.html#视频纹理" class="NavigationItem__router-link"> 视频纹理(VideoTexture) <span class="wedoc-beta-tag" style="margin-left:0;">Beta</span></a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/texture.html#使用纹理" class="NavigationItem__router-link"> 纹理使用约定 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/camera.html" class="NavigationItem__router-link"> 相机(Camera) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/render-texture.html" class="NavigationItem__router-link"> 渲染到纹理(RenderTexture) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/atlas.html" class="NavigationItem__router-link"> 图集(Atlas) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/env.html" class="NavigationItem__router-link"> 环境(EnvData) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/env.html#天空盒" class="NavigationItem__router-link"> 天空盒与背景(Skybox) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/light.html" class="NavigationItem__router-link"> 灯光(Light) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/light.html#阴影" class="NavigationItem__router-link"> 阴影(Shadow) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/render/post-process.html" class="NavigationItem__router-link"> 后处理(PostProcess) <span class="wedoc-beta-tag" style="margin-left:0;">Beta</span></a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-2"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/gltf/" class="NavigationItem__router-link"> GLTF </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/gltf/introduction.html" class="NavigationItem__router-link"> GLTF入门 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/gltf/specification.html" class="NavigationItem__router-link"> 使用说明 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/gltf/gallery.html" class="NavigationItem__router-link"> 画廊 </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-2"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/" class="NavigationItem__router-link"> AR </a>  </span></div> <ul class="NavigationLevel__children"><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-3"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/" class="NavigationItem__router-link"> AR系统(ARSystem) </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/#识别模式" class="NavigationItem__router-link"> 识别模式 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/#深度遮挡" class="NavigationItem__router-link"> 深度遮挡(DepthMask) <span class="wedoc-beta-tag" style="margin-left:0;">Beta</span></a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/#ARCamera" class="NavigationItem__router-link"> AR相机(ARCamera) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/#AR场景事件" class="NavigationItem__router-link"> AR场景事件 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/#不同AR追踪器的坐标系差异" class="NavigationItem__router-link"> 不同AR追踪器的坐标系差异 </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-3"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/tracker.html" class="NavigationItem__router-link"> AR追踪器(ARTracker) </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/tracker.html#二维Marker" class="NavigationItem__router-link"> 2D Marker(Marker) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/tracker.html#三维Marker" class="NavigationItem__router-link"> 3D Marker(Marker) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/tracker.html#OSD" class="NavigationItem__router-link"> OSD Marker(OSD) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/tracker.html#Plane" class="NavigationItem__router-link"> 平面识别(Plane) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/tracker.html#PlaneMarker" class="NavigationItem__router-link"> 平面识别结合Marker(Plane) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/tracker.html#threeDof" class="NavigationItem__router-link"> 3自由度(threeDof) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/tracker.html#Face" class="NavigationItem__router-link"> 人脸识别(Face) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/tracker.html#Body" class="NavigationItem__router-link"> 躯体识别(Body) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/tracker.html#Hand" class="NavigationItem__router-link"> 人手识别(Hand) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/ar/tracker.html#获取追踪状态" class="NavigationItem__router-link"> 获取追踪状态(TrackState) </a>  </span></li></ul></div></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-2"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/animation/" class="NavigationItem__router-link"> 动画 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/animation/" class="NavigationItem__router-link"> 动画系统(AnimationSystem) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/animation/#动画实现" class="NavigationItem__router-link"> 动画实现(Animation) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/animation/#动画组件" class="NavigationItem__router-link"> 动画组件(Animator) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/animation/keyframe.html" class="NavigationItem__router-link"> 帧动画(KeyframeAnimation) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/gltf/specification.html#gltf动画" class="NavigationItem__router-link"> gltf动画(ModelAnimation) </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-2"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/physics/" class="NavigationItem__router-link"> 交互和物理 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/physics/" class="NavigationItem__router-link"> 物理系统(PhysicSystem) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/physics/shape.html" class="NavigationItem__router-link"> 轮廓(Shape) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/physics/rigidbody.html" class="NavigationItem__router-link"> 刚体(Rigidbody) <span class="wedoc-beta-tag" style="margin-left:0;">Beta</span></a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/physics/interact.html" class="NavigationItem__router-link"> 轮廓交互(interact) <span class="wedoc-beta-tag" style="margin-left:0;">Beta</span></a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-2"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/particles/" class="NavigationItem__router-link"> 粒子 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/particles/" class="NavigationItem__router-link"> 粒子系统(Particles) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/particles/emiter.html" class="NavigationItem__router-link"> 发射器(Emitter) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/particles/attribute.html" class="NavigationItem__router-link"> 其他属性和动画 </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-2"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/share/" class="NavigationItem__router-link"> 分享 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/share/" class="NavigationItem__router-link"> 分享系统(ShareSystem) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/share/#截取画布" class="NavigationItem__router-link"> 截取画布(Capture) </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/share/#录制画布" class="NavigationItem__router-link"> 录制画布(Record) </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-2"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/builtin/env.html" class="NavigationItem__router-link"> 内置资源 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/builtin/env.html" class="NavigationItem__router-link"> 内置环境数据 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/builtin/geometry.html" class="NavigationItem__router-link"> 内置几何数据 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/builtin/texture.html" class="NavigationItem__router-link"> 内置纹理资源 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/builtin/effect.html" class="NavigationItem__router-link"> 内置效果资源 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/builtin/effect-simple.html" class="NavigationItem__router-link"> Simple效果 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/builtin/effect-standard.html" class="NavigationItem__router-link"> Standard效果 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/builtin/atlas.html" class="NavigationItem__router-link"> 内置图集 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/builtin/post-process.html" class="NavigationItem__router-link"> 内置后处理 </a>  </span></li></ul></div></li><li><div class="NavigationLevel NavigationLevel--closed NavigationLevel--level-2"><div class="NavigationLevel__parent"><span class="NavigationToggle NavigationToggle--closed"><span class="NavigationToggle__icon NavigationToggle__icon--closed"></span></span> <span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/tools/cli.html" class="NavigationItem__router-link"> 工具 </a>  </span></div> <ul class="NavigationLevel__children"><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/tools/debug.html#真机调试" class="NavigationItem__router-link"> 真机调试 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/tools/toolkit.html#环境数据生成" class="NavigationItem__router-link"> 环境数据生成 </a>  </span></li><li><span class="NavigationItem"> <a href="/miniprogram/dev/component/xr-frame/tools/toolkit.html#gltf优化" class="NavigationItem__router-link"> gltf优化 </a>  </span></li></ul></div></li></ul></div></li></ul></div></div> </aside></div> <div class="page__wrp"><main class="page"><div class="page-inner" style="min-height:0px;"> <div id="docContent"><div class="Breadcrumb"></div> <div class="content custom"><h1 id="store-product"><a href="#store-product" class="header-anchor">#</a> store-product</h1> <blockquote><p>基础库 3.5.5 开始支持，低版本需做<a href="../../analysis/experience/compatibility.html">兼容处理</a>。</p></blockquote> <blockquote><p><strong>微信鸿蒙 OS 版</strong>：支持</p></blockquote> <blockquote><p>相关文档: <a href="https://developers.weixin.qq.com/doc/store/API/basics/component.html">微信小店指引</a></p></blockquote> <p class="wedoc-support-tips">渲染框架支持情况：WebView</p> <h2 id="功能描述"><a href="#功能描述" class="header-anchor">#</a> 功能描述</h2> <p>小程序内嵌微信小店商品，展示小店商品，并进行跳转交易。支持小店优选联盟带货跟佣功能。</p> <h2 id="通用属性"><a href="#通用属性" class="header-anchor">#</a> 通用属性</h2> <div class="table-wrp"><table class="have-children-table"><thead><tr><th></th> <th>属性</th> <th>类型</th> <th>默认值</th> <th>必填</th> <th>说明</th> <th>最低版本</th></tr></thead> <tbody><tr><td><i class="toggle-children-table"></i></td> <td>appid</td> <td>string</td> <td></td> <td>是</td> <td>小店appid。获取方式：<a href="https://store.weixin.qq.com/shop/setting/home">小店后台</a> - 店铺管理 - 基础信息 - 账号信息 - 微信小店ID。</td> <td><a href="../../analysis/experience/compatibility.html">3.5.5</a></td></tr> <tr><td><i class="toggle-children-table"></i></td> <td>product-id</td> <td>string</td> <td></td> <td>是</td> <td>商品id。获取小店商品id，可以通过API获取(<a href="https://developers.weixin.qq.com/doc/store/API/product/get.html">参考链接</a>)或通过<a href="https://store.weixin.qq.com/shop/goods/list">小店后台</a> - 商品管理 - 商品列表 - 规格/编码获取。</td> <td><a href="../../analysis/experience/compatibility.html">3.5.5</a></td></tr> <tr><td><i class="toggle-children-table"></i></td> <td>product-promotion-link</td> <td>string</td> <td></td> <td>否</td> <td>带货商品跟佣信息。若需要商品售卖时使用小店优选联盟带货跟佣功能，可以通过API获取带货商品跟佣信息(<a href="https://developers.weixin.qq.com/doc/channels/API/windowproduct/get.html">参考链接</a>)。</td> <td><a href="../../analysis/experience/compatibility.html">3.5.5</a></td></tr> <tr><td><i class="toggle-children-table"></i></td> <td>media-id</td> <td>string</td> <td></td> <td>否</td> <td>媒体文件id。可以通过API获取(<a href="https://developers.weixin.qq.com/miniprogram/dev/platform-capabilities/business-capabilities/cooperation_shop/upload.html#%E4%B8%80%E3%80%81%E4%B8%8A%E4%BC%A0%E8%B5%84%E6%96%99">参考链接</a>)。</td> <td><a href="../../analysis/experience/compatibility.html">3.7.1</a></td></tr> <tr><td><i class="toggle-children-table"></i></td> <td>custom-style</td> <td>object</td> <td></td> <td>否</td> <td>自定义样式。支持自定义的样式请查看custom-style。</td> <td><a href="../../analysis/experience/compatibility.html">3.7.1</a></td></tr> <tr><td><i class="toggle-children-table"></i></td> <td>custom-content</td> <td>boolean</td> <td>false</td> <td>否</td> <td>开启自定义插槽。开启后可自行控制卡片内容。</td> <td><a href="../../analysis/experience/compatibility.html">3.7.2</a></td></tr> <tr class="have-children-tr show-children"><td><i class="toggle-children-table"></i></td> <td>open-page</td> <td>string</td> <td>product-detail</td> <td>否</td> <td>设置点击打开的页面(同时开启 custom-content 属性后生效)。</td> <td><a href="../../analysis/experience/compatibility.html">3.7.4</a></td></tr> <tr class="children-table"><td><i class="toggle-children-table"></i></td> <td colspan="6"><table><thead><tr><th style="width: 20%;">合法值</th> <th>说明</th> <th style="width: 20%;">最低版本</th></tr></thead> <tbody><tr><td>product-detail</td> <td>商品详情页</td> <td><a href="../../analysis/experience/compatibility.html">3.7.4</a></td></tr> <tr><td>gift-product-detail</td> <td>送礼商品详情页</td> <td><a href="../../analysis/experience/compatibility.html">3.7.7</a></td></tr> <tr><td>buy</td> <td>下单页</td> <td><a href="../../analysis/experience/compatibility.html">3.7.4</a></td></tr></tbody></table></td></tr> <tr class="have-children-tr show-children"><td><i class="toggle-children-table"></i></td> <td>logo-position</td> <td>string</td> <td>bottom-left</td> <td>否</td> <td>设置小店标识的位置，不允许隐藏(同时开启 custom-content 属性后生效)。</td> <td><a href="../../analysis/experience/compatibility.html">3.7.2</a></td></tr> <tr class="children-table"><td><i class="toggle-children-table"></i></td> <td colspan="6"><table><thead><tr><th style="width: 20%;">合法值</th> <th>说明</th></tr></thead> <tbody><tr><td>bottom-left</td> <td>左下方</td></tr> <tr><td>bottom-right</td> <td>右下方</td></tr></tbody></table></td></tr> <tr><td><i class="toggle-children-table"></i></td> <td>bindentersuccess</td> <td>eventhandle</td> <td></td> <td>否</td> <td>跳转小店成功的回调。</td> <td><a href="../../analysis/experience/compatibility.html">3.7.1</a></td></tr> <tr><td><i class="toggle-children-table"></i></td> <td>bindentererror</td> <td>eventhandle</td> <td></td> <td>否</td> <td>跳转小店失败的回调，event.detail={code,message}。</td> <td><a href="../../analysis/experience/compatibility.html">3.7.1</a></td></tr></tbody></table></div> <h2 id="自定义样式-custom-style"><a href="#自定义样式-custom-style" class="header-anchor">#</a> 自定义样式(custom-style)</h2> <div class="table-wrp"><table><thead><tr><th>键名</th> <th>说明</th> <th>允许自定义的属性</th></tr></thead> <tbody><tr><td>card</td> <td>卡片样式</td> <td>background-color</td></tr> <tr><td>title</td> <td>标题样式</td> <td>color</td></tr> <tr><td>price</td> <td>价格样式</td> <td>color</td></tr> <tr><td>buy-button</td> <td>购买按钮样式</td> <td>width、border-radius、color、background-color</td></tr> <tr><td>buy-button-disabled</td> <td>购买按钮禁用态样式</td> <td>width、border-radius、color、background-color</td></tr></tbody></table></div><h2 id="自定义样式-custom-style-示例代码"><a href="#自定义样式-custom-style-示例代码" class="header-anchor">#</a> 自定义样式(custom-style)示例代码</h2> <div class="language-html extra-class"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>store-product</span> <span class="token attr-name">appid</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>xxx<span class="token punctuation">"</span></span> <span class="token attr-name">product-id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>xxx<span class="token punctuation">"</span></span> <span class="token attr-name">custom-style</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>{{customStyle}}<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span> </code></pre></div><div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token function">Page</span><span class="token punctuation">(</span><span class="token punctuation">{</span> <span class="token literal-property property">data</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token literal-property property">customStyle</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token literal-property property">card</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token string-property property">'background-color'</span><span class="token operator">:</span> <span class="token string">'#FAFAFA'</span><span class="token punctuation">,</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token literal-property property">title</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token literal-property property">color</span><span class="token operator">:</span> <span class="token string">'rgba(0, 0, 0, 0.8)'</span><span class="token punctuation">,</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token literal-property property">price</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token literal-property property">color</span><span class="token operator">:</span> <span class="token string">'#FF6146'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token string-property property">'buy-button'</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token literal-property property">width</span><span class="token operator">:</span> <span class="token string">'100px'</span><span class="token punctuation">,</span> <span class="token string-property property">'border-radius'</span><span class="token operator">:</span> <span class="token string">'30px'</span><span class="token punctuation">,</span> <span class="token string-property property">'background-color'</span><span class="token operator">:</span> <span class="token string">'rgba(0,0,0,0.9)'</span><span class="token punctuation">,</span> <span class="token literal-property property">color</span><span class="token operator">:</span> <span class="token string">'#FFD48D'</span><span class="token punctuation">,</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token string-property property">'buy-button-disabled'</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token literal-property property">width</span><span class="token operator">:</span> <span class="token string">'100px'</span><span class="token punctuation">,</span> <span class="token string-property property">'border-radius'</span><span class="token operator">:</span> <span class="token string">'30px'</span><span class="token punctuation">,</span> <span class="token string-property property">'background-color'</span><span class="token operator">:</span> <span class="token string">'rgba(0,0,0,0.9)'</span><span class="token punctuation">,</span> <span class="token literal-property property">color</span><span class="token operator">:</span> <span class="token string">'#FFD48D'</span><span class="token punctuation">,</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">)</span> </code></pre></div><h2 id="使用自定义插槽-custom-content-示例代码"><a href="#使用自定义插槽-custom-content-示例代码" class="header-anchor">#</a> 使用自定义插槽(custom-content)示例代码</h2> <div class="language-html extra-class"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>store-product</span> <span class="token attr-name">appid</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>xxx<span class="token punctuation">"</span></span> <span class="token attr-name">product-id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>xxx<span class="token punctuation">"</span></span> <span class="token attr-name">custom-content</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>{{true}}<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span><span class="token punctuation">></span></span>自定义卡片内容<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>store-product</span><span class="token punctuation">></span></span> </code></pre></div><h3 id="detail-对象"><a href="#detail-对象" class="header-anchor">#</a> detail 对象</h3> <div class="table-wrp"><table><thead><tr><th>属性名</th> <th>类型</th> <th>说明</th></tr></thead> <tbody><tr><td>code</td> <td>Number</td> <td>状态码</td></tr> <tr><td>message</td> <td>String</td> <td>错误信息</td></tr></tbody></table></div><h5 id="code-有效值"><a href="#code-有效值" class="header-anchor">#</a> code 有效值</h5> <div class="table-wrp"><table><thead><tr><th>值</th> <th>说明</th></tr></thead> <tbody><tr><td>-1</td> <td>系统失败，请重试</td></tr> <tr><td>0</td> <td>成功</td></tr> <tr><td>10001</td> <td>无效的media-id</td></tr> <tr><td>10002</td> <td>无效的media-id</td></tr> <tr><td>10003</td> <td>文件正在上传中，请等待</td></tr> <tr><td>10004</td> <td>上传的文件存在风险，请重新上传</td></tr> <tr><td>20001</td> <td>该商品因违规已下架</td></tr> <tr><td>60001</td> <td>正在加载中</td></tr> <tr><td>60002</td> <td>正在渲染中</td></tr> <tr><td>60004</td> <td>加载异常</td></tr> <tr><td>60005</td> <td>加载失败</td></tr></tbody></table></div><h2 id="Bug-Tip"><a href="#Bug-Tip" class="header-anchor">#</a> Bug & Tip</h2> <ol><li><code>tip</code>：请保持组件的小店标识内容完整展示。</li> <li><code>tip</code>：参数 product-promotion-link、media-id 请在组件首次加载时传入，暂不支持在组件加载完成后调整参数</li> <li><code>tip</code>：暂不支持在微信 Windows 版和微信 Mac 版的小程序上使用本组件。</li></ol></div> <div class="fixed-translate" style="display:none;"><span>The translations are provided by WeChat Translation and are for reference only. In case of any inconsistency and discrepancy between the Chinese version and the English version, the Chinese version shall prevail.Incorrect translation. <a href="javascript:;" class="fixed-translate-btn">Tap to report.</a></span></div></div>  <div class="related"> </div> <footer class="page-edit"></footer> <footer class="footer"><ul class="footer-links"><li class="footer-link"><a href="http://www.tencent.com/zh-cn/index.shtml" target="_blank">关于腾讯</a></li> <li class="footer-link"><a href="https://mp.weixin.qq.com/debug/wxadoc/introduction/index.html?t=1484641676" target="_blank">文档中心</a></li> <li class="footer-link"><a href="https://kf.qq.com/faq/17030722muuu170307MFBny2.html" target="_blank">辟谣中心</a></li> <li class="footer-link"><a href="http://kf.qq.com/faq/120911VrYVrA1509086vyumm.html" target="_blank">客服中心</a></li></ul> <p class="copyright">Copyright © 2012-<span>2025</span> Tencent. All Rights Reserved.</p></footer></div></main></div> </div></div> <div id="popoverWrapId" class="pop-links__wrp popover_hide"><ul class="pop-links__list"><li class="pop-links__item"><button class="pop-link">复制</button></li> <li class="pop-links__item"><button class="pop-link">问题反馈</button></li></ul></div> <div class="fixed-btns"><a href="javascript:;" class="fixed-btn fixed-btn__feedback"><div class="fixed-btn__inner"><span class="fixed-btn__icon"></span> <span class="fixed-btn__text">反馈</span></div></a> <a href="javascript:;" class="fixed-btn fixed-btn__top" style="display:none;"><div class="fixed-btn__inner"><span class="fixed-btn__icon"></span></div></a></div></div></div></div> <script src="https://res.wx.qq.com/wxdoc/dist/assets/js/app.6ab6bfc0.js" defer></script><script src="https://res.wx.qq.com/wxdoc/dist/assets/js/2134.c02cbf88.js" defer></script> </body> </html>