需求复述
你想要获取微信小程序中返回按钮的完整实现代码，包括小程序原生自带的返回按钮配置（自动显示）和自定义返回按钮（手动实现，适配所有场景）的核心代码，以及不同返回逻辑的处理方式。
一、小程序原生返回按钮（自动显示，无需写按钮）
原生返回按钮由小程序导航栏自动控制，核心是页面配置和跳转方式，无需手动写按钮代码，只需保证配置和跳转逻辑正确。
1. 页面配置（xxx.json）
确保使用原生导航栏，原生返回按钮会自动显示（非首页时）：
json
{
  "navigationBarTitleText": "页面标题",
  "navigationStyle": "default", // 关键：使用原生导航栏（默认值，可省略）
  "enablePullDownRefresh": false
}
2. 跳转逻辑（进入当前页面的代码）
只有通过 wx.navigateTo 跳转，才会保留页面栈，原生返回按钮才会显示：
javascript
运行
// 从A页面跳转到B页面（B页面会显示原生返回按钮）
wx.navigateTo({
  url: '/pages/b/b', // 目标页面路径
  success: (res) => {
    console.log('跳转成功');
  }
});
关键说明
原生返回按钮自动显示条件：当前页面不是页面栈的第一个页面（即通过 wx.navigateTo 跳转进入）；
原生返回按钮自动隐藏条件：当前页面是页面栈第一个页面（如首页、通过 wx.switchTab/wx.redirectTo 跳转的页面）；
点击原生返回按钮，小程序自动执行 wx.navigateBack({ delta: 1 })，无需写任何事件代码。
二、自定义返回按钮（手动实现，适配所有场景）
若需要在自定义导航栏 / 任意位置添加返回按钮，可手动实现，以下是完整代码：
1. wxml（页面结构）
xml
<!-- 自定义返回按钮 -->
<view class="custom-back-btn" bindtap="handleGoBack">
  <image class="back-icon" src="/images/back.png" mode="aspectFill"></image>
  <text class="back-text">返回</text>
</view>
2. wxss（样式）
css
/* 自定义返回按钮样式 */
.custom-back-btn {
  display: flex;
  align-items: center;
  padding: 15rpx 20rpx;
  cursor: pointer;
}

.back-icon {
  width: 30rpx;
  height: 30rpx;
  margin-right: 10rpx;
}

.back-text {
  font-size: 28rpx;
  color: #333;
}
3. js（核心返回逻辑）
javascript
运行
Page({
  /**
   * 自定义返回按钮点击事件
   */
  handleGoBack() {
    // 方式1：优先返回上一页（推荐，保留页面栈状态）
    wx.navigateBack({
      delta: 1, // 返回上一级页面，delta=N则返回N级
      // 异常兜底：若没有上一页（页面栈为空），跳转到首页
      fail: () => {
        wx.switchTab({
          url: '/pages/index/index', // 替换为你的首页路径
          fail: () => {
            // 若首页不是tab页，用redirectTo跳转
            wx.redirectTo({
              url: '/pages/index/index'
            });
          }
        });
      }
    });

    // 方式2：直接跳转到指定页面（清空当前页面栈，适用于需要强制返回首页的场景）
    // wx.redirectTo({
    //   url: '/pages/index/index'
    // });

    // 方式3：跳转到tabBar页面（如首页是tab页）
    // wx.switchTab({
    //   url: '/pages/index/index'
    // });
  },

  // 其他页面生命周期/方法...
  onLoad(options) {},
  onShow() {}
});
三、不同返回 API 的区别（选型参考）
API 作用  页面栈影响   适用场景
wx.navigateBack 返回上 N 级页面   仅出栈，保留原有页面栈 从子页面返回父页面
wx.redirectTo   跳转到指定页面，关闭当前页面  替换当前页面栈 无需返回当前页面的场景
wx.switchTab    跳转到 tabBar 页面，关闭其他页 清空非 tabBar 页面栈  返回 tabBar 首页 / 底部导航页
wx.navigateTo   跳转到新页面，保留当前页面   入栈，新增页面栈    从父页面进入子页面
四、完整示例（自定义返回按钮 + 原生返回兼容）
以下是一个完整的页面示例，包含自定义返回按钮，同时兼容原生返回逻辑：
1. pages/test/test.json
json
{
  "navigationBarTitleText": "测试页面",
  "navigationStyle": "default"
}
2. pages/test/test.wxml
xml
<view class="container">
  <!-- 自定义返回按钮 -->
  <view class="custom-back-btn" bindtap="handleGoBack">
    <text class="back-text">← 返回</text>
  </view>

  <!-- 页面内容 -->
  <view class="content">测试页面内容</view>
</view>
3. pages/test/test.wxss
css
.container {
  min-height: 100vh;
  background-color: #f5f5f5;
}

.custom-back-btn {
  padding: 20rpx 30rpx;
  background-color: #fff;
}

.back-text {
  font-size: 30rpx;
  color: #000;
}

.content {
  padding: 50rpx;
  font-size: 32rpx;
  text-align: center;
}
4. pages/test/test.js
javascript
运行
Page({
  data: {},

  // 自定义返回按钮事件
  handleGoBack() {
    // 尝试返回上一页
    wx.navigateBack({
      delta: 1,
      fail: () => {
        // 无返回页时跳首页
        wx.switchTab({
          url: '/pages/index/index',
          fail: () => {
            wx.redirectTo({
              url: '/pages/index/index'
            });
          }
        });
      }
    });
  },

  onLoad(options) {},
  onShow() {}
});
总结
原生返回按钮：无需写按钮代码，只需保证 navigationStyle: default 且通过 wx.navigateTo 跳转，小程序自动显示 / 触发返回；
自定义返回按钮：核心是 wx.navigateBack + 异常兜底（跳首页），适配所有场景，代码可直接复用；
选型建议：优先用原生返回（符合用户习惯），需自定义位置 / 样式时，用 handleGoBack 方法实现，记得加 fail 兜底避免点击无反应。