微信小程序功能页导航 functional-page-navigator 组件

r囧r小猫 2021-09-08 05:14 350阅读 0赞

[完整**微信小程序(Java后端) 技术贴**目录清单页面（必看）][Java_]

仅在插件中有效，用于跳转到插件功能页。

<table> 
 <thead> 
  <tr> 
   <th align="left">属性</th> 
   <th align="left">类型</th> 
   <th align="left">默认值</th> 
   <th align="left">必填</th> 
   <th align="left">说明</th> 
   <th align="left">最低版本</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td align="left">version</td> 
   <td align="left">string</td> 
   <td align="left">release</td> 
   <td align="left">否</td> 
   <td align="left">跳转到的小程序版本，<strong>线上版本必须设置为 release</strong></td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/compatibility.html" rel="nofollow">2.1.0</a></td> 
  </tr> 
  <tr> 
   <td align="left">name</td> 
   <td align="left">string</td> 
   <td align="left"></td> 
   <td align="left">否</td> 
   <td align="left">要跳转到的功能页</td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/compatibility.html" rel="nofollow">2.1.0</a></td> 
  </tr> 
  <tr> 
   <td align="left">args</td> 
   <td align="left">object</td> 
   <td align="left"></td> 
   <td align="left">否</td> 
   <td align="left">功能页参数，参数格式与具体功能页相关</td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/compatibility.html" rel="nofollow">2.1.0</a></td> 
  </tr> 
  <tr> 
   <td align="left">bindsuccess</td> 
   <td align="left">eventhandler</td> 
   <td align="left"></td> 
   <td align="left">否</td> 
   <td align="left">功能页返回，且操作成功时触发， detail 格式与具体功能页相关</td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/compatibility.html" rel="nofollow">2.1.0</a></td> 
  </tr> 
  <tr> 
   <td align="left">bindfail</td> 
   <td align="left">eventhandler</td> 
   <td align="left"></td> 
   <td align="left">否</td> 
   <td align="left">功能页返回，且操作失败时触发， detail 格式与具体功能页相关</td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/compatibility.html" rel="nofollow">2.1.0</a></td> 
  </tr> 
  <tr> 
   <td align="left">bindcancel</td> 
   <td align="left">eventhandler</td> 
   <td align="left"></td> 
   <td align="left">否</td> 
   <td align="left">因用户操作从功能页返回时触发</td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/compatibility.html" rel="nofollow">2.4.1</a></td> 
  </tr> 
 </tbody> 
</table>

**version 的合法值**

<table> 
 <thead> 
  <tr> 
   <th align="left">值</th> 
   <th align="left">说明</th> 
   <th align="left">最低版本</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td align="left">develop</td> 
   <td align="left">开发版</td> 
   <td align="left"></td> 
  </tr> 
  <tr> 
   <td align="left">trial</td> 
   <td align="left">体验版</td> 
   <td align="left"></td> 
  </tr> 
  <tr> 
   <td align="left">release</td> 
   <td align="left">正式版</td> 
   <td align="left"></td> 
  </tr> 
 </tbody> 
</table>

**name 的合法值**

<table> 
 <thead> 
  <tr> 
   <th align="left">值</th> 
   <th align="left">说明</th> 
   <th align="left">最低版本</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td align="left">loginAndGetUserInfo</td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/plugin/functional-pages/user-info.html" rel="nofollow">用户信息功能页</a></td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/compatibility.html" rel="nofollow">2.1.0</a></td> 
  </tr> 
  <tr> 
   <td align="left">requestPayment</td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/plugin/functional-pages/request-payment.html" rel="nofollow">支付功能页</a></td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/compatibility.html" rel="nofollow">2.1.0</a></td> 
  </tr> 
  <tr> 
   <td align="left">chooseAddress</td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/plugin/functional-pages/choose-address.html" rel="nofollow">收货地址功能页</a></td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/compatibility.html" rel="nofollow">2.4.0</a></td> 
  </tr> 
  <tr> 
   <td align="left">chooseInvoice</td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/plugin/functional-pages/choose-invoice.html" rel="nofollow">获取发票功能页</a></td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/compatibility.html" rel="nofollow">2.14.1</a></td> 
  </tr> 
  <tr> 
   <td align="left">chooseInvoiceTitle</td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/plugin/functional-pages/choose-invoice-title.html" rel="nofollow">获取发票抬头功能页</a></td> 
   <td align="left"><a href="https://developers.weixin.qq.com/miniprogram/dev/framework/compatibility.html" rel="nofollow">2.14.1</a></td> 
  </tr> 
 </tbody> 
</table>

**Bug & Tip**

1.  `tip`: 功能页是插件所有者小程序中的一个特殊页面，开发者不能自定义这个页面的外观。
2.  `tip`: 在功能页展示时，一些与界面展示相关的接口将被禁用（接口调用返回 fail ）。
3.  `tip`: 这个组件本身可以在开发者工具中使用，但功能页的跳转目前不支持在开发者工具中调试，请在真机上测试。

**示例代码**

<functional-page-navigator name="loginAndGetUserInfo" bind:success="loginSuccess">
      <button>登录到插件</button>
    </functional-page-navigator>
    // redirect.js navigator.js
    Component({
      methods: {
        loginSuccess: function(e) {
          console.log(e.detail.code) // wx.login 的 code
          console.log(e.detail.userInfo) // wx.getUserInfo 的 userInfo
        }
      }
    })

> 微信搜一搜【java1234】关注这个放荡不羁的程序员，关注后回复【资料】有我准备的一线大厂笔试面试资料以及简历模板。

[Java_]: https://blog.csdn.net/caoli201314/article/details/116643190