hookehuyr

feat(页面): 在发布车源页面添加顶部导航栏

添加 NutNavbar 组件用于顶部导航,替换原生的导航栏标题设置
移除原生的 wx.setNavigationBarTitle 调用
新增返回按钮功能及样式配置
......@@ -20,6 +20,7 @@ declare module 'vue' {
NutInput: typeof import('@nutui/nutui-taro')['Input']
NutMenu: typeof import('@nutui/nutui-taro')['Menu']
NutMenuItem: typeof import('@nutui/nutui-taro')['MenuItem']
NutNavbar: typeof import('@nutui/nutui-taro')['Navbar']
NutOverlay: typeof import('@nutui/nutui-taro')['Overlay']
NutPicker: typeof import('@nutui/nutui-taro')['Picker']
NutPopup: typeof import('@nutui/nutui-taro')['Popup']
......
<template>
<view class="sell-page">
<!-- 顶部导航 -->
<nut-config-provider :theme-vars="themeVars">
<nut-sticky top="0">
<nut-navbar v-if="!isAuthMode" :title="isEditMode ? '编辑车源' : '发布车源'" left-show @on-click-back="goBack">
<template #left-show>
<RectLeft color="white" />
</template>
</nut-navbar>
</nut-sticky>
</nut-config-provider>
<!-- 表单内容 -->
<view class="form-container">
<!-- 车辆照片上传 -->
......@@ -285,11 +296,25 @@
<script setup>
import { ref, reactive, onMounted } from 'vue'
import { Plus, Right, Location, Close } from '@nutui/icons-vue-taro'
import { Plus, Right, Location, Close, RectLeft } from '@nutui/icons-vue-taro'
import Taro from '@tarojs/taro'
import BASE_URL from '@/utils/config';
import './index.less'
const themeVars = ref({
navbarBackground: '#fb923c',
navbarColor: '#ffffff',
})
/**
* 返回上一页
*/
const goBack = () => {
Taro.redirectTo({
url: '/pages/index/index'
})
}
// 获取页面参数
const instance = Taro.getCurrentInstance()
const { id, mode, type } = instance.router?.params || {}
......@@ -811,9 +836,9 @@ onMounted(() => {
loadCarData()
}
// 动态修改标题
wx.setNavigationBarTitle({
title: isEditMode.value ? '编辑车源' : '发布车源'
});
// wx.setNavigationBarTitle({
// title: isEditMode.value ? '编辑车源' : '发布车源'
// });
if (isAuthMode.value) {
wx.setNavigationBarTitle({
title: '发布车源'
......