@shixinde/vuepress-theme-init
Version:
325 lines • 98.2 kB
HTML
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<meta name="generator" content="VuePress 2.0.0-rc.14" />
<style>
:root {
--c-bg: #fff;
}
html.dark {
--c-bg: #22272e;
}
html,
body {
background-color: var(--c-bg);
}
</style>
<script>
const userMode = localStorage.getItem('vuepress-color-scheme')
const systemDarkMode =
window.matchMedia &&
window.matchMedia('(prefers-color-scheme: dark)').matches
if (userMode === 'dark' || (userMode !== 'light' && systemDarkMode)) {
document.documentElement.classList.toggle('dark', true)
}
</script>
<link rel="icon" href="/favicon.ico"><title>Uni-App 笔记 | Guoguo-notes</title><meta name="description" content="袁果锅笔记">
<link rel="preload" href="/guoguo-notes/assets/style-35EaXqtH.css" as="style"><link rel="stylesheet" href="/guoguo-notes/assets/style-35EaXqtH.css">
<link rel="modulepreload" href="/guoguo-notes/assets/app-Dx9bNbfq.js"><link rel="modulepreload" href="/guoguo-notes/assets/Uni-App笔记.html-BUy_Af_M.js">
<link rel="prefetch" href="/guoguo-notes/assets/index.html-D6hY1Pr0.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/React.html-DpSypgmq.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/java jdk 管理.html-UyxKEztz.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/lingzhi.html-DrDRjKEH.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/临时使用.html-D81L-GXB.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/新公司.html-Bp4Oxj5H.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/项目架构升级版.html-CpJwv32O.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/风扬小记.html-BTKAsyQB.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Python代码片段.html-3rxV2C-F.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Python笔记.html-DfxyADl3.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/AjaxResult.html-CcB1SHt9.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Java 基础.html-C0Mw79YJ.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Java 注解.html-DMhJ2pfz.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/MyBatis Plus.html-DXaupZNq.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/MySQL完整.html-E-VKR_Bm.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Mybatis 语法.html-BtyLUnj2.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/StringBoot.html-IewOkkS1.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/idea 插件.html-yFlZz-2q.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/idea快捷键.html-CI1PJIaN.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/java 代码片段.html-mGveOiyh.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/mySql.html-mha8lKTS.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/分页插件使用.html-BpMDhHym.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/项目初始化.html-TexbaFDo.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/02_react案例_笔记.html-BzISG9Ro.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/03_react-router_教程.html-CiEuDnOl.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/04_react-UI_教程.html-CptRBAn1.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/05_redux笔记.html-BBtVc0mQ.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/React 笔记.html-BPeqw1PX.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/React 项目配置流程.html-BXl6Ye6r.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/尚硅谷React扩展笔记.html-CCxyveD2.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/尚硅谷react-redux笔记.html-DYzvAaxv.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/index.html-3ZVA3kn7.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Element Plus --vue3.0.html-DXuv_b9N.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Element ui 笔记.html-sVqlVk_V.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Taro.html-CA8JB-of.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Vue 代码片段.html-DKeMa5iO.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Vue 全局封装 main.js.html-D9vo-8hy.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Vue 笔记.html-DGHKF3_K.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Vue3 .html--oEgCjOt.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Vue3_Element Plus.html-BVAoHXff.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/element plus 本地启动.html-CgsgPmvg.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/jsx tsx 代码片段.html-G1ShCdaZ.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/jsx tsx 笔记.html-BtuYzmC-.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/uniapp笔记.html-ok2vMZAr.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/vite 笔记.html-D-EBkJ0C.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/vite手写插件.html-Cggy24Oh.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/vue.js 下载文件.html-B1uCoFDS.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/vueuse笔记.html-DS6eTZ6y.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/vxe-table笔记.html-yUGgZHig.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/代码片段 - 解析数学公式.html-DdcBDyRv.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/常用插件.html-CZkTIVvE.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/汇智腾远笔记.html-moZCMq7M.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/视频播放插件.html-BcEFDEgf.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/CSS笔记.html-fAv9dNNH.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Echarts.html-Cge55fid.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Git 代码管理.html-B63UoB0T.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Html 笔记.html--NntXjWX.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/TypeScript.html-D-Qjaudh.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/axios 请求拦截.html-D1TCv2Mj.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/js常规.html-Ka8coTuF.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/npm.html-B-EmKZd8.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/sh 笔记.html-B3G_4KZW.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/valibot校验学习.html-BBH2-2ZH.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/云开发教程.html-DRtT7hW1.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/公共API接口.html-p1pxjePH.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/小程序笔记.html-BJbLxiMh.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/插件库.html-CZ-6S-Qp.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/服务器.html-BNfIswB8.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/服务器部署教学.html-T1qkai4O.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/浏览器px to rem适配.html-DPzD4TkF.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/登录逻辑.html-D5sdqJbb.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/网站配色.html-B_2Exge9.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/跨域代理.html-BYkKrkY7.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/接入AI.html-DVRrF1MA.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/查看 编辑对话框组件.html-zEZcOjWH.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/简易电影选座.html-TuQVklis.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/index.html-1f6p3-c_.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/CSS--common.html-D0ck7nMZ.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/ES6.html-wEFap9Uq.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Git提交.html-CHssaRZs.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Js获取当前时间的方法.html-BRnoMyWs.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Uni-app API.html-CAzH1d66.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Uniapp-插件.html-DB8eOvmu.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/VueX 笔记.html-BrvLUsYq.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/js函数封装.html-Cc5d9Th4.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/js常规.html-CIq-xlv8.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/uView基本使用.html-CCsyyvNN.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/uniapp 引入组件库.html-BnVxGutO.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/常用正则表达式.html-AS2O_lcX.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/界面类.html-BEOhA9U_.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/笔记.html-DcjAVSiK.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/组件封装.html-BF9gShal.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/编程逻辑整理.html-CZRD3wTo.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/调用接口.html-DniVQnty.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/SSH 配置.html-9u6Q-DHg.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/Editor.html-CfSL24h8.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/分页组件.html-DcRa4Q6p.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/拖拽组件.html-D6yjy7lX.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/index.html-LinbGCk2.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/GIt 代码提交规范及步骤.html-w7f6_4N9.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/命名_ 开发期间的命名规范.html-DhnWSrsL.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/大佬项目组织规范.html-B32Km5um.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/重要_框架 - 初始化项目约束.html-Sw9ULLk3.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/404.html-BZdzN0T2.js" as="script"><link rel="prefetch" href="/guoguo-notes/assets/SearchResult-DqPIHYal.js" as="script">
</head>
<body>
<div id="app"><!--[--><div class="vp-theme-container external-link-icon"><!--[--><header class="vp-navbar"><div class="vp-toggle-sidebar-button" title="toggle sidebar" aria-expanded="false" role="button" tabindex="0"><div class="icon" aria-hidden="true"><span></span><span></span><span></span></div></div><span><a class="route-link" href="/guoguo-notes/"><!----><span class="vp-site-name" aria-hidden="true">Guoguo-notes</span></a></span><div class="vp-navbar-items-wrapper" style=""><!--[--><!--]--><nav class="vp-navbar-items vp-hide-mobile" aria-label="site navigation"><!--[--><div class="vp-navbar-item"><a class="route-link auto-link" href="/guoguo-notes/" aria-label="主页"><!---->主页<!----></a></div><div class="vp-navbar-item"><a class="route-link auto-link" href="/guoguo-notes/%E5%B8%B8%E7%94%A8%E7%AC%94%E8%AE%B0/%E7%BD%91%E7%AB%99%E9%85%8D%E8%89%B2.html" aria-label="常用笔记"><!---->常用笔记<!----></a></div><div class="vp-navbar-item"><a class="route-link auto-link" href="/guoguo-notes/vue%E7%AC%94%E8%AE%B0%E5%8F%8A%E5%91%A8%E8%BE%B9%E7%94%9F%E6%80%81/Vue%20%E7%AC%94%E8%AE%B0.html" aria-label="vue笔记及周边生态"><!---->vue笔记及周边生态<!----></a></div><div class="vp-navbar-item"><div class="vp-navbar-dropdown-wrapper"><button class="vp-navbar-dropdown-title" type="button" aria-label="袁果锅生态"><span class="title">袁果锅生态</span><span class="arrow down"></span></button><button class="vp-navbar-dropdown-title-mobile" type="button" aria-label="袁果锅生态"><span class="title">袁果锅生态</span><span class="right arrow"></span></button><ul style="display:none;" class="vp-navbar-dropdown"><!--[--><li class="vp-navbar-dropdown-item"><a class="route-link auto-link" href="/guoguo-notes/%E8%A2%81%E6%9E%9C%E9%94%85%E7%94%9F%E6%80%81/%E5%9B%A2%E9%98%9F%E5%8D%8F%E4%BD%9C%E5%8F%8A%E8%A7%84%E8%8C%83/%E5%91%BD%E5%90%8D_%20%E5%BC%80%E5%8F%91%E6%9C%9F%E9%97%B4%E7%9A%84%E5%91%BD%E5%90%8D%E8%A7%84%E8%8C%83.html" aria-label="团队协作及规范"><!---->团队协作及规范<!----></a></li><li class="vp-navbar-dropdown-item"><a class="route-link auto-link" href="/guoguo-notes/%E8%A2%81%E6%9E%9C%E9%94%85%E7%94%9F%E6%80%81/%E9%A1%B9%E7%9B%AE%E6%A1%86%E6%9E%B6%E5%8F%8A%E6%9E%B6%E6%9E%84/%E9%87%8D%E8%A6%81_%E6%A1%86%E6%9E%B6%20-%20%E5%88%9D%E5%A7%8B%E5%8C%96%E9%A1%B9%E7%9B%AE%E7%BA%A6%E6%9D%9F.html" aria-label="项目框架及架构"><!---->项目框架及架构<!----></a></li><!--]--></ul></div></div><div class="vp-navbar-item"><div class="vp-navbar-dropdown-wrapper"><button class="vp-navbar-dropdown-title" type="button" aria-label="个人笔记"><span class="title">个人笔记</span><span class="arrow down"></span></button><button class="vp-navbar-dropdown-title-mobile" type="button" aria-label="个人笔记"><span class="title">个人笔记</span><span class="right arrow"></span></button><ul style="display:none;" class="vp-navbar-dropdown"><!--[--><li class="vp-navbar-dropdown-item"><a class="route-link route-link-active auto-link" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/Uni-App%E7%AC%94%E8%AE%B0.html" aria-label="飞码篇"><!---->飞码篇<!----></a></li><li class="vp-navbar-dropdown-item"><a class="route-link auto-link" href="/guoguo-notes/Java/Java%20%E5%9F%BA%E7%A1%80.html" aria-label="Java"><!---->Java<!----></a></li><li class="vp-navbar-dropdown-item"><a class="route-link auto-link" href="/guoguo-notes/React%E7%AC%94%E8%AE%B0/React%20%E7%AC%94%E8%AE%B0.html" aria-label="React笔记"><!---->React笔记<!----></a></li><!--]--></ul></div></div><div class="vp-navbar-item"><a class="auto-link external-link" href="https://github.com/shixindea/shixinde-notes" aria-label="GitHub" rel="noopener noreferrer" target="_blank"><!---->GitHub<!----></a></div><!--]--></nav><!--[--><!--]--><button class="vp-toggle-color-mode-button" title="toggle color mode"><svg class="light-icon" viewbox="0 0 32 32" style=""><path d="M16 12.005a4 4 0 1 1-4 4a4.005 4.005 0 0 1 4-4m0-2a6 6 0 1 0 6 6a6 6 0 0 0-6-6z" fill="currentColor"></path><path d="M5.394 6.813l1.414-1.415l3.506 3.506L8.9 10.318z" fill="currentColor"></path><path d="M2 15.005h5v2H2z" fill="currentColor"></path><path d="M5.394 25.197L8.9 21.691l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 25.005h2v5h-2z" fill="currentColor"></path><path d="M21.687 23.106l1.414-1.415l3.506 3.506l-1.414 1.414z" fill="currentColor"></path><path d="M25 15.005h5v2h-5z" fill="currentColor"></path><path d="M21.687 8.904l3.506-3.506l1.414 1.415l-3.506 3.505z" fill="currentColor"></path><path d="M15 2.005h2v5h-2z" fill="currentColor"></path></svg><svg class="dark-icon" viewbox="0 0 32 32" style="display:none;"><path d="M13.502 5.414a15.075 15.075 0 0 0 11.594 18.194a11.113 11.113 0 0 1-7.975 3.39c-.138 0-.278.005-.418 0a11.094 11.094 0 0 1-3.2-21.584M14.98 3a1.002 1.002 0 0 0-.175.016a13.096 13.096 0 0 0 1.825 25.981c.164.006.328 0 .49 0a13.072 13.072 0 0 0 10.703-5.555a1.01 1.01 0 0 0-.783-1.565A13.08 13.08 0 0 1 15.89 4.38A1.015 1.015 0 0 0 14.98 3z" fill="currentColor"></path></svg></button><!--[--><button type="button" class="search-pro-button" aria-label="搜索"><svg xmlns="http://www.w3.org/2000/svg" class="icon search-icon" viewBox="0 0 1024 1024" fill="currentColor" aria-label="search icon" name="search"><path d="M192 480a256 256 0 1 1 512 0 256 256 0 0 1-512 0m631.776 362.496-143.2-143.168A318.464 318.464 0 0 0 768 480c0-176.736-143.264-320-320-320S128 303.264 128 480s143.264 320 320 320a318.016 318.016 0 0 0 184.16-58.592l146.336 146.368c12.512 12.48 32.768 12.48 45.28 0 12.48-12.512 12.48-32.768 0-45.28"></path></svg><div class="search-pro-placeholder">搜索</div><div class="search-pro-key-hints"><kbd class="search-pro-key">Ctrl</kbd><kbd class="search-pro-key">K</kbd></div></button><!--]--></div></header><!--]--><div class="vp-sidebar-mask"></div><!--[--><aside class="vp-sidebar"><nav class="vp-navbar-items" aria-label="site navigation"><!--[--><div class="vp-navbar-item"><a class="route-link auto-link" href="/guoguo-notes/" aria-label="主页"><!---->主页<!----></a></div><div class="vp-navbar-item"><a class="route-link auto-link" href="/guoguo-notes/%E5%B8%B8%E7%94%A8%E7%AC%94%E8%AE%B0/%E7%BD%91%E7%AB%99%E9%85%8D%E8%89%B2.html" aria-label="常用笔记"><!---->常用笔记<!----></a></div><div class="vp-navbar-item"><a class="route-link auto-link" href="/guoguo-notes/vue%E7%AC%94%E8%AE%B0%E5%8F%8A%E5%91%A8%E8%BE%B9%E7%94%9F%E6%80%81/Vue%20%E7%AC%94%E8%AE%B0.html" aria-label="vue笔记及周边生态"><!---->vue笔记及周边生态<!----></a></div><div class="vp-navbar-item"><div class="vp-navbar-dropdown-wrapper"><button class="vp-navbar-dropdown-title" type="button" aria-label="袁果锅生态"><span class="title">袁果锅生态</span><span class="arrow down"></span></button><button class="vp-navbar-dropdown-title-mobile" type="button" aria-label="袁果锅生态"><span class="title">袁果锅生态</span><span class="right arrow"></span></button><ul style="display:none;" class="vp-navbar-dropdown"><!--[--><li class="vp-navbar-dropdown-item"><a class="route-link auto-link" href="/guoguo-notes/%E8%A2%81%E6%9E%9C%E9%94%85%E7%94%9F%E6%80%81/%E5%9B%A2%E9%98%9F%E5%8D%8F%E4%BD%9C%E5%8F%8A%E8%A7%84%E8%8C%83/%E5%91%BD%E5%90%8D_%20%E5%BC%80%E5%8F%91%E6%9C%9F%E9%97%B4%E7%9A%84%E5%91%BD%E5%90%8D%E8%A7%84%E8%8C%83.html" aria-label="团队协作及规范"><!---->团队协作及规范<!----></a></li><li class="vp-navbar-dropdown-item"><a class="route-link auto-link" href="/guoguo-notes/%E8%A2%81%E6%9E%9C%E9%94%85%E7%94%9F%E6%80%81/%E9%A1%B9%E7%9B%AE%E6%A1%86%E6%9E%B6%E5%8F%8A%E6%9E%B6%E6%9E%84/%E9%87%8D%E8%A6%81_%E6%A1%86%E6%9E%B6%20-%20%E5%88%9D%E5%A7%8B%E5%8C%96%E9%A1%B9%E7%9B%AE%E7%BA%A6%E6%9D%9F.html" aria-label="项目框架及架构"><!---->项目框架及架构<!----></a></li><!--]--></ul></div></div><div class="vp-navbar-item"><div class="vp-navbar-dropdown-wrapper"><button class="vp-navbar-dropdown-title" type="button" aria-label="个人笔记"><span class="title">个人笔记</span><span class="arrow down"></span></button><button class="vp-navbar-dropdown-title-mobile" type="button" aria-label="个人笔记"><span class="title">个人笔记</span><span class="right arrow"></span></button><ul style="display:none;" class="vp-navbar-dropdown"><!--[--><li class="vp-navbar-dropdown-item"><a class="route-link route-link-active auto-link" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/Uni-App%E7%AC%94%E8%AE%B0.html" aria-label="飞码篇"><!---->飞码篇<!----></a></li><li class="vp-navbar-dropdown-item"><a class="route-link auto-link" href="/guoguo-notes/Java/Java%20%E5%9F%BA%E7%A1%80.html" aria-label="Java"><!---->Java<!----></a></li><li class="vp-navbar-dropdown-item"><a class="route-link auto-link" href="/guoguo-notes/React%E7%AC%94%E8%AE%B0/React%20%E7%AC%94%E8%AE%B0.html" aria-label="React笔记"><!---->React笔记<!----></a></li><!--]--></ul></div></div><div class="vp-navbar-item"><a class="auto-link external-link" href="https://github.com/shixindea/shixinde-notes" aria-label="GitHub" rel="noopener noreferrer" target="_blank"><!---->GitHub<!----></a></div><!--]--></nav><!--[--><!--]--><ul class="vp-sidebar-items"><!--[--><li><p tabindex="0" class="vp-sidebar-item vp-sidebar-heading active">飞码篇 <!----></p><ul style="" class="vp-sidebar-children"><!--[--><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/CSS--common.html" aria-label="1. CSS--common.md"><!---->1. CSS--common.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/ES6.html" aria-label="2. ES6.md"><!---->2. ES6.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/Git%E6%8F%90%E4%BA%A4.html" aria-label="3. Git提交.md"><!---->3. Git提交.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/Js%E8%8E%B7%E5%8F%96%E5%BD%93%E5%89%8D%E6%97%B6%E9%97%B4%E7%9A%84%E6%96%B9%E6%B3%95.html" aria-label="4. Js获取当前时间的方法.md"><!---->4. Js获取当前时间的方法.md<!----></a><!----></li><li><a class="route-link route-link-active auto-link vp-sidebar-item active" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/Uni-App%E7%AC%94%E8%AE%B0.html" aria-label="5. Uni-App笔记.md"><!---->5. Uni-App笔记.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/Uni-app%20API.html" aria-label="6. Uni-app API.md"><!---->6. Uni-app API.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/Uniapp-%E6%8F%92%E4%BB%B6.html" aria-label="7. Uniapp-插件.md"><!---->7. Uniapp-插件.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/VueX%20%E7%AC%94%E8%AE%B0.html" aria-label="8. VueX 笔记.md"><!---->8. VueX 笔记.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/js%E5%87%BD%E6%95%B0%E5%B0%81%E8%A3%85.html" aria-label="9. js函数封装.md"><!---->9. js函数封装.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/js%E5%B8%B8%E8%A7%84.html" aria-label="10. js常规.md"><!---->10. js常规.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/uView%E5%9F%BA%E6%9C%AC%E4%BD%BF%E7%94%A8.html" aria-label="11. uView基本使用.md"><!---->11. uView基本使用.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/uniapp%20%E5%BC%95%E5%85%A5%E7%BB%84%E4%BB%B6%E5%BA%93.html" aria-label="12. uniapp 引入组件库.md"><!---->12. uniapp 引入组件库.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/%E5%B8%B8%E7%94%A8%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F.html" aria-label="13. 常用正则表达式.md"><!---->13. 常用正则表达式.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/%E7%95%8C%E9%9D%A2%E7%B1%BB.html" aria-label="14. 界面类.md"><!---->14. 界面类.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/%E7%AC%94%E8%AE%B0.html" aria-label="15. 笔记.md"><!---->15. 笔记.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/%E7%BB%84%E4%BB%B6%E5%B0%81%E8%A3%85.html" aria-label="16. 组件封装.md"><!---->16. 组件封装.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/%E7%BC%96%E7%A8%8B%E9%80%BB%E8%BE%91%E6%95%B4%E7%90%86.html" aria-label="17. 编程逻辑整理.md"><!---->17. 编程逻辑整理.md<!----></a><!----></li><li><a class="route-link auto-link vp-sidebar-item" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/%E8%B0%83%E7%94%A8%E6%8E%A5%E5%8F%A3.html" aria-label="18. 调用接口.md"><!---->18. 调用接口.md<!----></a><!----></li><!--]--></ul></li><!--]--></ul><!--[--><!--]--></aside><!--]--><!--[--><main class="vp-page"><!--[--><!--]--><div class="theme-default-content"><!--[--><!--]--><div><h2 id="_1-使用系统默认的导航栏样式" tabindex="-1"><a class="header-anchor" href="#_1-使用系统默认的导航栏样式"><span>1. 使用系统默认的导航栏样式</span></a></h2><blockquote><p>在page.json 中将对应的<code>navigationStyle</code>改为 <code>custom</code></p></blockquote><div class="language-vue line-numbers-mode" data-highlighter="prismjs" data-ext="vue" data-title="vue"><pre class="language-vue"><code><span class="line">"navigationStyle": "custom"</span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div></div></div><h2 id="_2-pages-json-中-将级联文件夹指定到本文件夹中" tabindex="-1"><a class="header-anchor" href="#_2-pages-json-中-将级联文件夹指定到本文件夹中"><span>2. pages.json 中 将级联文件夹指定到本文件夹中</span></a></h2><div class="language-vue line-numbers-mode" data-highlighter="prismjs" data-ext="vue" data-title="vue"><pre class="language-vue"><code><span class="line">{</span>
<span class="line"> "root": "card",</span>
<span class="line"> "name": "card",</span>
<span class="line"> "pages": [</span>
<span class="line"> // 首页</span>
<span class="line"> {</span>
<span class="line"> "path": "index/index",</span>
<span class="line"> "style": {</span>
<span class="line"> "navigationBarTitleText": "卡券服务",</span>
<span class="line"> "navigationBarTextStyle": "black"</span>
<span class="line"> }</span>
<span class="line"> }, // 个人中心</span>
<span class="line"> {</span>
<span class="line"> "path": "me/me",</span>
<span class="line"> "style": {</span>
<span class="line"> "navigationStyle": "custom"</span>
<span class="line"> }</span>
<span class="line"> }, </span>
<span class="line"> ]</span>
<span class="line">}</span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="_3-uni-app-路由跳转" tabindex="-1"><a class="header-anchor" href="#_3-uni-app-路由跳转"><span>3. uni-app 路由跳转</span></a></h2><blockquote><p>注意：</p><p>navigateTo, redirectTo 只能打开非 tabBar 页面。 switchTab 只能打开 tabBar 页面。 reLaunch 可以打开任意页面。 页面底部的 tabBar 由页面决定，即只要是定义为 tabBar 的页面，底部都有 tabBar。 不能在 App.vue 里面进行页面跳转</p></blockquote><blockquote><p>1.navigateTo（保留当前页面，跳转到其他页面，使用navigateTo可以返回上一页）</p></blockquote><div class="language-text line-numbers-mode" data-highlighter="prismjs" data-ext="text" data-title="text"><pre class="language-text"><code><span class="line">uni.navigateTo({</span>
<span class="line"> url:'./straSettings'</span>
<span class="line">});</span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><blockquote><p>2.reLaunch（关闭所有页面，跳转到其他页面）</p></blockquote><div class="language-text line-numbers-mode" data-highlighter="prismjs" data-ext="text" data-title="text"><pre class="language-text"><code><span class="line">uni.reLaunch({</span>
<span class="line"> url:'./straSettings'</span>
<span class="line">})</span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><blockquote><p>3.redirectTo（关闭当前页面，跳转到其他页面）</p></blockquote><div class="language-text line-numbers-mode" data-highlighter="prismjs" data-ext="text" data-title="text"><pre class="language-text"><code><span class="line">uni.redirectTo({</span>
<span class="line"> url:'./straSettings'</span>
<span class="line">})</span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><blockquote><p>4.switchTab（适用于底部导航栏之间的跳转，或者跳转到底部导航栏）</p></blockquote><div class="language-text line-numbers-mode" data-highlighter="prismjs" data-ext="text" data-title="text"><pre class="language-text"><code><span class="line">uni.switchTab({</span>
<span class="line"> url: '../strategy/strategy'</span>
<span class="line">});</span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><blockquote><p>5.location.href（适用于跳转到外部链接）</p></blockquote><div class="language-text line-numbers-mode" data-highlighter="prismjs" data-ext="text" data-title="text"><pre class="language-text"><code><span class="line">location.href ='https://blog.csdn.net/weixin_50606255/article/details/118391274';</span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div></div></div><h2 id="_4-textarea框怎么设置输入字数和显示用户所输入的字数" tabindex="-1"><a class="header-anchor" href="#_4-textarea框怎么设置输入字数和显示用户所输入的字数"><span>4.textarea框怎么设置输入字数和显示用户所输入的字数</span></a></h2><p>示例图片：</p><p><img src="https://s1.ax1x.com/2022/06/14/Xhl0r4.png" alt=""></p><blockquote><p>思路讲解</p><p>这其实就是一个<code>textarea框</code> 右下角加入了一个用于显示字符的占位框</p><p>使用上 <code>uni.app</code> 自带的 <code>@input</code> 方法里面的 <code>detail</code> 就可以获取到文本框的字数了</p><p><strong>注意</strong>在调用这个函数的的时候 <code>@input="getLength"</code> 一定不要自己传参数了 @input="getLength(e) "</p></blockquote><div class="language-vue line-numbers-mode" data-highlighter="prismjs" data-ext="vue" data-title="vue"><pre class="language-vue"><code><span class="line"></span>
<span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>textarea</span> <span class="token attr-name">maxlength</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span>100</span> <span class="token attr-name">rows</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>6<span class="token punctuation">"</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>更多不爽？必须吐槽<span class="token punctuation">"</span></span> <span class="token attr-name">@input</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>getLength<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span></span>
<span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>text</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>right-bottom-text<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>{{textlength}}/100<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>text</span><span class="token punctuation">></span></span></span>
<span class="line"></span>
<span class="line"> // 定义一个变量</span>
<span class="line"></span>
<span class="line">data(){</span>
<span class="line"> return{</span>
<span class="line"> textlength:0,</span>
<span class="line"> }</span>
<span class="line">}</span>
<span class="line"></span>
<span class="line">//使用这个方法来调用，</span>
<span class="line">methods: {</span>
<span class="line"> getLength(e) {</span>
<span class="line"> this.textlength=e.detail.cursor</span>
<span class="line">},</span>
<span class="line"></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="_5-查看更多-收起-不单单可以使用显示隐藏来做还可以使用overflow-hidden" tabindex="-1"><a class="header-anchor" href="#_5-查看更多-收起-不单单可以使用显示隐藏来做还可以使用overflow-hidden"><span>5.查看更多/收起 不单单可以使用显示隐藏来做还可以使用overflow: hidden</span></a></h2><div class="language-vue line-numbers-mode" data-highlighter="prismjs" data-ext="vue" data-title="vue"><pre class="language-vue"><code><span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>item<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>label <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>text</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>w4em<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>text</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>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>value<span class="token punctuation">"</span></span> <span class="token attr-name">:class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>{heightHidden:!istravelHeight}<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span><span class="token punctuation">></span></span> 张强|1306**********4814 <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span><span class="token punctuation">></span></span> 张强|1306**********4814 <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span><span class="token punctuation">></span></span> 张强|1306**********4814 <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span><span class="token punctuation">></span></span> 张强|1306**********4814 <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span><span class="token punctuation">></span></span> 张强|1306**********4814 <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span><span class="token punctuation">></span></span> 张强|1306**********4814 <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span><span class="token punctuation">></span></span> 张强|1306**********4814 <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span><span class="token punctuation">></span></span> 张强|1306**********4814 <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token punctuation">"</span></span><span class="token punctuation">></span></span> 张强|1306**********4814 <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>centertext<span class="token punctuation">"</span></span> <span class="token attr-name">@click</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>travelHeight<span class="token punctuation">"</span></span> <span class="token attr-name">v-if</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>!istravelHeight<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></span>
<span class="line"> 查看更多 <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>text</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>cuIcon-unfold<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>text</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>view</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>centertext<span class="token punctuation">"</span></span> <span class="token attr-name">@click</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>travelHeight<span class="token punctuation">"</span></span> <span class="token attr-name">v-else</span><span class="token punctuation">></span></span></span>
<span class="line"> 收起<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>text</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>cuIcon-up<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>text</span><span class="token punctuation">></span></span></span>
<span class="line"> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>view</span><span class="token punctuation">></span></span></span>
<span class="line"></span>
<span class="line">--------------------------------------------------------------------------</span>
<span class="line"></span>
<span class="line"> // 定义一个变量</span>
<span class="line"></span>
<span class="line">data(){</span>
<span class="line"> return{</span>
<span class="line"> istravelHeight:false,//是否点击了 `出行信息` 的查看更多</span>
<span class="line"> }</span>
<span class="line">}</span>
<span class="line"></span>
<span class="line">//使用这个方法来调用，</span>
<span class="line">methods: {</span>
<span class="line"> travelHeight(){</span>
<span class="line"> this.istravelHeight=!this.istravelHeight</span>
<span class="line"> },</span>
<span class="line">},</span>
<span class="line"></span>
<span class="line">--------------------------------------------------------------------------</span>
<span class="line">// css 样式</span>
<span class="line">.heightHidden{</span>
<span class="line"> height: 100upx;</span>
<span class="line"> overflow: hidden;</span>
<span class="line">}</span>
<span class="line">.centertext{</span>
<span class="line"> margin: 0 auto;</span>
<span class="line"> font-size: 26upx;</span>
<span class="line"> color: #999;</span>
<span class="line"> height: 40upx;</span>
<span class="line"> display: flex;</span>
<span class="line"> line-height: 1;</span>
<span class="line"> align-items: center;</span>
<span class="line"> justify-content: center;</span>
<span class="line"> margin-top: 20upx;</span>
<span class="line">}</span>
<span class="line"></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="_6-对于uni-app来说-设置整屏的背景" tabindex="-1"><a class="header-anchor" href="#_6-对于uni-app来说-设置整屏的背景"><span>6. 对于uni-app来说，设置整屏的背景</span></a></h2><blockquote><p>让这个屏幕最小高度为1屏，如果多的话，他会自适应</p></blockquote><div class="language-css line-numbers-mode" data-highlighter="prismjs" data-ext="css" data-title="css"><pre class="language-css"><code><span class="line"> <span class="token selector">.container</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token property">width</span><span class="token punctuation">:</span> 100%<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">background-color</span><span class="token punctuation">:</span> #f7f7f7<span class="token punctuation">;</span></span>
<span class="line"> <span class="token property">min-height</span><span class="token punctuation">:</span> 100vh<span class="token punctuation">;</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="_7-带参数跳转路由" tabindex="-1"><a class="header-anchor" href="#_7-带参数跳转路由"><span>7.带参数跳转路由</span></a></h2><blockquote><p>示例数据</p></blockquote><div class="language-javascript line-numbers-mode" data-highlighter="prismjs" data-ext="js" data-title="js"><pre class="language-javascript"><code><span class="line"> <span class="token function">data</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token keyword">return</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">datalist</span><span class="token operator">:</span><span class="token punctuation">[</span></span>
<span class="line"> <span class="token punctuation">{</span><span class="token literal-property property">id</span><span class="token operator">:</span><span class="token number">1</span><span class="token punctuation">,</span><span class="token literal-property property">title</span><span class="token operator">:</span><span class="token string">"餐饮美食商家入驻"</span><span class="token punctuation">,</span><span class="token literal-property property">data</span><span class="token operator">:</span><span class="token string">"到店堂食吸引新客..."</span><span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">{</span><span class="token literal-property property">id</span><span class="token operator">:</span><span class="token number">2</span><span class="token punctuation">,</span><span class="token literal-property property">title</span><span class="token operator">:</span><span class="token string">"民宿商家入驻"</span><span class="token punctuation">,</span><span class="token literal-property property">data</span><span class="token operator">:</span><span class="token string">"在家创业，即刻触达..."</span><span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">{</span><span class="token literal-property property">id</span><span class="token operator">:</span><span class="token number">3</span><span class="token punctuation">,</span><span class="token literal-property property">title</span><span class="token operator">:</span><span class="token string">"客运车企商家入驻"</span><span class="token punctuation">,</span><span class="token literal-property property">data</span><span class="token operator">:</span><span class="token string">"信息覆盖全国..."</span><span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">{</span><span class="token literal-property property">id</span><span class="token operator">:</span><span class="token number">4</span><span class="token punctuation">,</span><span class="token literal-property property">title</span><span class="token operator">:</span><span class="token string">"景区景点商家入驻"</span><span class="token punctuation">,</span><span class="token literal-property property">data</span><span class="token operator">:</span><span class="token string">"助力景区商家数字化..."</span><span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">{</span><span class="token literal-property property">id</span><span class="token operator">:</span><span class="token number">5</span><span class="token punctuation">,</span><span class="token literal-property property">title</span><span class="token operator">:</span><span class="token string">"生活服务商家入驻"</span><span class="token punctuation">,</span><span class="token literal-property property">data</span><span class="token operator">:</span><span class="token string">"到店堂食吸引新客..."</span><span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">{</span><span class="token literal-property property">id</span><span class="token operator">:</span><span class="token number">6</span><span class="token punctuation">,</span><span class="token literal-property property">title</span><span class="token operator">:</span><span class="token string">"旅游服务商家入驻"</span><span class="token punctuation">,</span><span class="token literal-property property">data</span><span class="token operator">:</span><span class="token string">"海量旅游产品直达..."</span><span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">{</span><span class="token literal-property property">id</span><span class="token operator">:</span><span class="token number">7</span><span class="token punctuation">,</span><span class="token literal-property property">title</span><span class="token operator">:</span><span class="token string">"导游人员入驻"</span><span class="token punctuation">,</span><span class="token literal-property property">data</span><span class="token operator">:</span><span class="token string">"新模式新机遇..."</span><span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">{</span><span class="token literal-property property">id</span><span class="token operator">:</span><span class="token number">8</span><span class="token punctuation">,</span><span class="token literal-property property">title</span><span class="token operator">:</span><span class="token string">"景区景点商家入驻"</span><span class="token punctuation">,</span><span class="token literal-property property">data</span><span class="token operator">:</span><span class="token string">"助力景区商家数字化... "</span><span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">]</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><blockquote><p>使用这个方法跳转的时候带上参数</p><p><code>父元素传参</code></p></blockquote><div class="language-javascript line-numbers-mode" data-highlighter="prismjs" data-ext="js" data-title="js"><pre class="language-javascript"><code><span class="line"><span class="token operator"><</span>view <span class="token keyword">class</span><span class="token operator">=</span><span class="token string">"list"</span> v<span class="token operator">-</span><span class="token keyword">for</span><span class="token operator">=</span><span class="token string">"item in datalist"</span> <span class="token operator">:</span>key<span class="token operator">=</span><span class="token string">"item.id"</span> @click<span class="token operator">=</span><span class="token string">"gotoItem(item.title)"</span><span class="token operator">></span></span>
<span class="line"> <span class="token operator"><</span>view <span class="token keyword">class</span><span class="token operator">=</span><span class="token string">"top flex space-between"</span><span class="token operator">></span></span>
<span class="line"> <span class="token punctuation">{</span><span class="token punctuation">{</span>item<span class="token punctuation">.</span>title<span class="token punctuation">}</span><span class="token punctuation">}</span> <span class="token operator"><</span>text <span class="token keyword">class</span><span class="token operator">=</span><span class="token string">"cuIcon-right"</span><span class="token operator">></span><span class="token operator"><</span><span class="token operator">/</span>text<span class="token operator">></span></span>
<span class="line"><span class="token operator"><</span><span class="token operator">/</span>view<span class="token operator">></span></span>
<span class="line"><span class="token operator"><</span>view <span class="token keyword">class</span><span class="token operator">=</span><span class="token string">"bottom nowrap"</span><span class="token operator">></span></span>
<span class="line"> <span class="token punctuation">{</span><span class="token punctuation">{</span>item<span class="token punctuation">.</span>data<span class="token punctuation">}</span><span class="token punctuation">}</span></span>
<span class="line"> <span class="token operator"><</span><span class="token operator">/</span>view<span class="token operator">></span></span>
<span class="line"><span class="token operator"><</span><span class="token operator">/</span>view<span class="token operator">></span></span>
<span class="line"> </span>
<span class="line"><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">--</span><span class="token operator">-</span></span>
<span class="line"> <span class="token comment">// 方法在这里</span></span>
<span class="line"> <span class="token function">gotoItem</span><span class="token punctuation">(</span><span class="token parameter">title</span><span class="token punctuation">)</span><span class="token punctuation">{</span></span>
<span class="line"> uni<span class="token punctuation">.</span><span class="token function">navigateTo</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">url</span><span class="token operator">:</span><span class="token string">"business-item?title="</span><span class="token operator">+</span>title<span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><blockquote><p><code>子元素接收</code>在<code>onLoad </code> 中进行接收数据</p></blockquote><div class="language-javascript line-numbers-mode" data-highlighter="prismjs" data-ext="js" data-title="js"><pre class="language-javascript"><code><span class="line"> <span class="token function">onLoad</span><span class="token punctuation">(</span><span class="token parameter">e</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line"> uni<span class="token punctuation">.</span><span class="token function">setNavigationBarTitle</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">title</span><span class="token operator">:</span> e<span class="token punctuation">.</span>title</span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span></span>
<span class="line"> <span class="token comment">// console.log(e.title);</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="_8-uni-app-方法之呼叫电话" tabindex="-1"><a class="header-anchor" href="#_8-uni-app-方法之呼叫电话"><span>8.uni-app 方法之呼叫电话</span></a></h2><div class="language-javascript line-numbers-mode" data-highlighter="prismjs" data-ext="js" data-title="js"><pre class="language-javascript"><code><span class="line"><span class="token function">callPhone</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span></span>
<span class="line"> uni<span class="token punctuation">.</span><span class="token function">makePhoneCall</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">phoneNumber</span><span class="token operator">:</span> <span class="token string">"15512555998"</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"><span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="_9-路由跳转" tabindex="-1"><a class="header-anchor" href="#_9-路由跳转"><span>9. 路由跳转</span></a></h2><pre><code> // 跳转tabbar中的页面
uni.switchTab({
url:"pages/index/index",
})
// 关闭当前页面跳转到下一个页面
uni.redirectTo({
url:"pages/index/index",
})
//guanbi 当前所有页面 再跳转
uni.reLaunch({
url:"pages/index/index",
})
// 保留当前跳转到下一个页面
uni.navigateTo({
url:"pages/index/index",
fail(e) {
console.log(e);
}
})
</code></pre><p></p><h2 id="_10-验证方法是否出错-或者错误在哪里" tabindex="-1"><a class="header-anchor" href="#_10-验证方法是否出错-或者错误在哪里"><span>10.验证方法是否出错，或者错误在哪里</span></a></h2><blockquote><p>使用下面这个方法来排查</p></blockquote><pre><code> // 保留当前跳转到下一个页面
uni.navigateTo({
url:"pages/index/index",
fail(e) {
console.log(e);
}
})
</code></pre><h2 id="_11-跳转到微信客服" tabindex="-1"><a class="header-anchor" href="#_11-跳转到微信客服"><span>11.跳转到微信客服</span></a></h2><blockquote><p><strong>前提：</strong></p><ol><li>必须是<code>button</code> 按钮</li><li>加上命令行<code> open-type="contact"</code></li></ol></blockquote><div class="language-vue line-numbers-mode" data-highlighter="prismjs" data-ext="vue" data-title="vue"><pre class="language-vue"><code><span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>item flex align-center space-between <span class="token punctuation">"</span></span> <span class="token attr-name">open-type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>contact<span class="token punctuation">"</span></span><span class="token punctuation">></span></span></span>
<span class="line"> 点击跳转</span>
<span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</span><span class="token punctuation">></span></span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="_12-清除缓存" tabindex="-1"><a class="header-anchor" href="#_12-清除缓存"><span>12.清除缓存</span></a></h2><blockquote><p>init() 为初始化数据，在onload页面初始化加载中就初始化数据，</p><p>clearStorage() 方法是清除缓存的数据</p><p><strong>加载的命令行</strong></p><div class="language-javascript line-numbers-mode" data-highlighter="prismjs" data-ext="js" data-title="js"><pre class="language-javascript"><code><span class="line">uni<span class="token punctuation">.</span><span class="token function">showLoading</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">title</span><span class="token operator">:</span><span class="token string">'正在清除缓存...'</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><p><strong>清除缓存的命令行</strong></p><div class="language-javascript line-numbers-mode" data-highlighter="prismjs" data-ext="js" data-title="js"><pre class="language-javascript"><code><span class="line">uni<span class="token punctuation">.</span><span class="token function">setStorageSync</span><span class="token punctuation">(</span><span class="token string">'token'</span><span class="token punctuation">,</span><span class="token string">''</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div></div></div><p><strong>加载结束的提示行</strong></p><div class="language-javascript line-numbers-mode" data-highlighter="prismjs" data-ext="js" data-title="js"><pre class="language-javascript"><code><span class="line"><span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"><span class="token comment">// 重新初始化页面</span></span>
<span class="line"><span class="token function">setTimeout</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token operator">=></span><span class="token punctuation">{</span></span>
<span class="line"> uni<span class="token punctuation">.</span><span class="token function">showToast</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">title</span><span class="token operator">:</span><span class="token string">'清除成功'</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token literal-property property">icon</span><span class="token operator">:</span><span class="token string">'none'</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span></span>
<span class="line"><span class="token punctuation">}</span><span class="token punctuation">,</span><span class="token number">1000</span><span class="token punctuation">)</span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div></blockquote><div class="language-javascript line-numbers-mode" data-highlighter="prismjs" data-ext="js" data-title="js"><pre class="language-javascript"><code><span class="line"> <span class="token function">onload</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token literal-property property">methods</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token comment">// 获取头像,</span></span>
<span class="line"> </span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token function">clearStorage</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line"> uni<span class="token punctuation">.</span><span class="token function">showLoading</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">title</span><span class="token operator">:</span><span class="token string">'正在清除缓存...'</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> uni<span class="token punctuation">.</span><span class="token function">setStorageSync</span><span class="token punctuation">(</span><span class="token string">'token'</span><span class="token punctuation">,</span><span class="token string">''</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token keyword">this</span><span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token comment">// 重新初始化页面</span></span>
<span class="line"> <span class="token function">setTimeout</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token operator">=></span><span class="token punctuation">{</span></span>
<span class="line"> uni<span class="token punctuation">.</span><span class="token function">showToast</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">title</span><span class="token operator">:</span><span class="token string">'清除成功'</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token literal-property property">icon</span><span class="token operator">:</span><span class="token string">'none'</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">,</span><span class="token number">1000</span><span class="token punctuation">)</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="_13-修改上一个页面的值" tabindex="-1"><a class="header-anchor" href="#_13-修改上一个页面的值"><span>13. 修改上一个页面的值</span></a></h2><div class="language-javascript line-numbers-mode" data-highlighter="prismjs" data-ext="js" data-title="js"><pre class="language-javascript"><code><span class="line"><span class="token function">addOK</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token comment">// 获取上一个页面的数据,</span></span>
<span class="line"> <span class="token comment">// 获取当前开着的所有的页面对象,array, item => 所有的参数和方法</span></span>
<span class="line"> <span class="token keyword">var</span> pages <span class="token operator">=</span> <span class="token function">getCurrentPages</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token comment">// 获取数组的倒数第二个对象</span></span>
<span class="line"> <span class="token keyword">var</span> prePage <span class="token operator">=</span> pages<span class="token punctuation">[</span>pages<span class="token punctuation">.</span>length <span class="token operator">-</span> <span class="token number">2</span><span class="token punctuation">]</span><span class="token punctuation">;</span></span>
<span class="line"> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">"pages:"</span><span class="token punctuation">,</span>pages<span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">"prePage:"</span><span class="token punctuation">,</span>prePage<span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token comment">// 修改</span></span>
<span class="line"> prePage<span class="token punctuation">.</span>$vm<span class="token punctuation">.</span>btnText<span class="token punctuation">.</span><span class="token function">push</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">title</span><span class="token operator">:</span><span class="token keyword">this</span><span class="token punctuation">.</span>title<span class="token punctuation">,</span></span>
<span class="line"> <span class="token literal-property property">type</span><span class="token operator">:</span><span class="token string">'radio'</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token literal-property property">content</span><span class="token operator">:</span><span class="token punctuation">[</span><span class="token string">'value1'</span><span class="token punctuation">,</span><span class="token string">'value2'</span><span class="token punctuation">]</span></span>
<span class="line"> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token comment">// 返回上一个页面 </span></span>
<span class="line"> uni<span class="token punctuation">.</span><span class="token function">navigateBack</span><span class="token punctuation">(</span><span class="token punctuation">{</span><span class="token punctuation">}</span><span class="token punctuation">)</span></span>
<span class="line"><span class="token punctuation">}</span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="_14-生命周期" tabindex="-1"><a class="header-anchor" href="#_14-生命周期"><span>14.生命周期</span></a></h2><table><thead><tr><th style="text-align:left;">函数名</th><th style="text-align:left;">说明</th></tr></thead><tbody><tr><td style="text-align:left;">onLaunch</td><td style="text-align:left;">当<code>uni-app</code> 初始化完成时触发（全局只触发一次）</td></tr><tr><td style="text-align:left;">onShow</td><td style="text-align:left;">当 <code>uni-app</code> 启动，或从后台进入前台显示</td></tr><tr><td style="text-align:left;">onHide</td><td style="text-align:left;">当 <code>uni-app</code> 从前台进入后台</td></tr><tr><td style="text-align:left;">onError</td><td style="text-align:left;">当 <code>uni-app</code> 报错时触发</td></tr><tr><td style="text-align:left;">onUniNViewMessage</td><td style="text-align:left;">对 <code>nvue</code> 页面发送的数据进行监听，可参考 <a href="https://uniapp.dcloud.io/tutorial/nvue-api?id=communication" target="_blank" rel="noopener noreferrer">nvue 向 vue 通讯(opens new window)</a></td></tr><tr><td style="text-align:left;">onUnhandledRejection</td><td style="text-align:left;">对未处理的 Promise 拒绝事件监听函数（2.8.1+）</td></tr><tr><td style="text-align:left;">onPageNotFound</td><td style="text-align:left;">页面不存在监听函数</td></tr><tr><td style="text-align:left;">onThemeChange</td><td style="text-align:left;">监听系统主题变化</td></tr></tbody></table><h2 id="_15-富文本转为文本-富文本解析" tabindex="-1"><a class="header-anchor" href="#_15-富文本转为文本-富文本解析"><span>15. 富文本转为文本 富文本解析</span></a></h2><p><img src="https://s1.ax1x.com/2022/06/28/jemSG8.png" alt=""></p><h3 id="方法一-rich-text" tabindex="-1"><a class="header-anchor" href="#方法一-rich-text"><span>方法一 rich-text</span></a></h3><blockquote><p>使用这一行命令 可以将 :nodes="你所填的数据" 转换为正常文本 如果需要定义样式的话，可以在请求的时候，通过正则，将p改为p style="padding:10upx</p></blockquote><div class="language-html line-numbers-mode" data-highlighter="prismjs" data-ext="html" data-title="html"><pre class="language-html"><code><span class="line"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>rich-text</span> <span class="token attr-name">:nodes</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>data.content<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>rich-text</span><span class="token punctuation">></span></span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div></div></div><h3 id="方法二-使用-hubildx-插件-可定制" tabindex="-1"><a class="header-anchor" href="#方法二-使用-hubildx-插件-可定制"><span>方法二 使用 hubildx 插件 可定制</span></a></h3><p><a href="https://ext.dcloud.net.cn/plugin?id=183" target="_blank" rel="noopener noreferrer">uParse 富文本解析 - DCloud 插件市场</a></p><h2 id="_16-所有的wx-方法-都可以直接写成-uni-方法" tabindex="-1"><a class="header-anchor" href="#_16-所有的wx-方法-都可以直接写成-uni-方法"><span>16. 所有的wx.方法 ，都可以直接写成 uni.方法</span></a></h2><h2 id="_17-获取上一个页面的方法-或者值" tabindex="-1"><a class="header-anchor" href="#_17-获取上一个页面的方法-或者值"><span>17.获取上一个页面的方法，或者值</span></a></h2><pre><code> if (flag === 1) {
console.log('ok');
// 获取上一个页面的数据,
// 获取当前开着的所有的页面对象,array, item => 所有的参数和方法
var pages = getCurrentPages();
// 获取数组的倒数第二个对象
var prePage = pages[pages.length - 2];
console.log('prePage', prePage)
if(this.listSelect==9){this.listSelect=10}
// 修改
//创建的情况
prePage.$vm.btnText.push({
title: this.title,
form_data_type: this.listSelect+1,
options: this.optionVal,
is_check: true,
is_required: 1, //如果已选中，利用这个判断是必填（红色）还是选填（蓝色）
});
prePage.$vm.isMust()
// prePage.$vm.btnStylels=prePage.$vm.btnText.length
uni.navigateBack({})
}
</code></pre><h2 id="_18-图片没加载的时候有提示-图片加载完成隐藏" tabindex="-1"><a class="header-anchor" href="#_18-图片没加载的时候有提示-图片加载完成隐藏"><span>18 图片没加载的时候有提示，图片加载完成隐藏</span></a></h2><div class="language-javascript line-numbers-mode" data-highlighter="prismjs" data-ext="js" data-title="js"><pre class="language-javascript"><code><span class="line">uni<span class="token punctuation">.</span><span class="token function">showLoading</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">title</span><span class="token operator">:</span> <span class="token string">'正在加载···'</span></span>
<span class="line"><span class="token punctuation">}</span><span class="token punctuation">)</span></span>
<span class="line"><span class="token function">getImage</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">data</span><span class="token operator">:</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">code</span><span class="token operator">:</span> <span class="token keyword">this</span><span class="token punctuation">.</span>code<span class="token punctuation">,</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"><span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span><span class="token parameter">res</span> <span class="token operator">=></span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token keyword">if</span> <span class="token punctuation">(</span>res<span class="token punctuation">.</span>code <span class="token operator">==</span> <span class="token number">1</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line"> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>res<span class="token punctuation">.</span>data<span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"> <span class="token keyword">this</span><span class="token punctuation">.</span>img <span class="token operator">=</span> res<span class="token punctuation">.</span>data<span class="token punctuation">.</span>images<span class="token punctuation">;</span></span>
<span class="line"> uni<span class="token punctuation">.</span><span class="token function">hideLoading</span><span class="token punctuation">(</span><span class="token punctuation">)</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"><span class="token punctuation">}</span><span class="token punctuation">)</span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div><h2 id="_19-防止事件冒泡-tap-stop" tabindex="-1"><a class="header-anchor" href="#_19-防止事件冒泡-tap-stop"><span>19.防止事件冒泡 @tap.stop</span></a></h2><blockquote><p>使用<a href="https://so.csdn.net/so/search?q=uniapp&spm=1001.2101.3001.7020" target="_blank" rel="noopener noreferrer">uniapp</a>开发小程序的时候，@click.stop来做事件冒泡没有作用。 需要把@click.stop改成@tap.stop就可以实现了。</p></blockquote><h2 id="使用代码-实现弹框功能" tabindex="-1"><a class="header-anchor" href="#使用代码-实现弹框功能"><span>使用代码 实现弹框功能</span></a></h2><div class="language-javascript line-numbers-mode" data-highlighter="prismjs" data-ext="js" data-title="js"><pre class="language-javascript"><code><span class="line">uni<span class="token punctuation">.</span><span class="token function">showModal</span><span class="token punctuation">(</span><span class="token punctuation">{</span></span>
<span class="line"> <span class="token literal-property property">title</span><span class="token operator">:</span> <span class="token string">'不可编辑!'</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token literal-property property">content</span><span class="token operator">:</span> <span class="token string">'当前记录已被填写数据！'</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token literal-property property">confirmColor</span><span class="token operator">:</span> <span class="token string">'#ee6666'</span><span class="token punctuation">,</span> <span class="token comment">//确定字体颜色</span></span>
<span class="line"> <span class="token literal-property property">showCancel</span><span class="token operator">:</span> <span class="token boolean">false</span><span class="token punctuation">,</span> <span class="token comment">//没有取消按钮的弹框</span></span>
<span class="line"> <span class="token literal-property property">buttonText</span><span class="token operator">:</span> <span class="token string">'确定'</span><span class="token punctuation">,</span></span>
<span class="line"> <span class="token function-variable function">success</span><span class="token operator">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">res</span><span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line"> <span class="token keyword">if</span> <span class="token punctuation">(</span>res<span class="token punctuation">.</span>confirm<span class="token punctuation">)</span> <span class="token punctuation">{</span></span>
<span class="line"></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"> <span class="token punctuation">}</span></span>
<span class="line"><span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></span>
<span class="line"></span></code></pre><div class="line-numbers" aria-hidden="true" style="counter-reset:line-number 0;"><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div><div class="line-number"></div></div></div></div><!--[--><!--]--></div><footer class="vp-page-meta"><div class="vp-meta-item edit-link"><a class="auto-link external-link label" href="https://github.com/shixindea/shixinde-notes/edit/main/飞码篇/Uni-App笔记.md" aria-label="Edit this page" rel="noopener noreferrer" target="_blank"><!--[--><svg class="edit-icon" viewbox="0 0 1024 1024"><g fill="currentColor"><path d="M430.818 653.65a60.46 60.46 0 0 1-50.96-93.281l71.69-114.012 7.773-10.365L816.038 80.138A60.46 60.46 0 0 1 859.225 62a60.46 60.46 0 0 1 43.186 18.138l43.186 43.186a60.46 60.46 0 0 1 0 86.373L588.879 565.55l-8.637 8.637-117.466 68.234a60.46 60.46 0 0 1-31.958 11.229z"></path><path d="M728.802 962H252.891A190.883 190.883 0 0 1 62.008 771.98V296.934a190.883 190.883 0 0 1 190.883-192.61h267.754a60.46 60.46 0 0 1 0 120.92H252.891a69.962 69.962 0 0 0-69.098 69.099V771.98a69.962 69.962 0 0 0 69.098 69.098h475.911A69.962 69.962 0 0 0 797.9 771.98V503.363a60.46 60.46 0 1 1 120.922 0V771.98A190.883 190.883 0 0 1 728.802 962z"></path></g></svg><!--]-->Edit this page<!----></a></div><div class="vp-meta-item git-info"><div class="vp-meta-item last-updated"><span class="meta-item-label">Last Updated: </span><!----></div><div class="vp-meta-item contributors"><span class="meta-item-label">Contributors: </span><span class="meta-item-info"><!--[--><!--[--><span class="contributor" title="email: 2914310412@qq.com">袁果锅</span><!----><!--]--><!--]--></span></div></div></footer><nav class="vp-page-nav" aria-label="page navigation"><a class="route-link auto-link prev" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/Js%E8%8E%B7%E5%8F%96%E5%BD%93%E5%89%8D%E6%97%B6%E9%97%B4%E7%9A%84%E6%96%B9%E6%B3%95.html" aria-label="4. Js获取当前时间的方法.md"><div class="hint"><span class="arrow left"></span> Prev</div><div class="link"><span>4. Js获取当前时间的方法.md</span></div></a><a class="route-link auto-link next" href="/guoguo-notes/%E9%A3%9E%E7%A0%81%E7%AF%87/Uni-app%20API.html" aria-label="6. Uni-app API.md"><div class="hint">Next <span class="arrow right"></span></div><div class="link"><span>6. Uni-app API.md</span></div></a></nav><!--[--><!--]--></main><!--]--></div><!--[--><!----><!----><!--]--><!--]--></div>
<script type="module" src="/guoguo-notes/assets/app-Dx9bNbfq.js" defer></script>
</body>
</html>