You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
<!-- 自选股页面 --><template> <view class="container"> <!-- 自定义导航栏 --> <view class="custom-navbar"> <view class="navbar-content"> <view class="navbar-left"> <view class="back-btn" @click="goBack"> <text class="back-icon">‹</text> </view> </view> <view class="navbar-center"> <text class="navbar-title">我的自选</text> </view> <view class="navbar-right"> <image class="navbar-btn" src="https://d31zlh4on95l9h.cloudfront.net/images/ba5c8a2eda065274e868bcd9b2d7d914.png" @click="onFirstButtonClick" mode="aspectFit" ></image> <image class="navbar-btn" src="https://d31zlh4on95l9h.cloudfront.net/images/a4ae8952aeae90dac6d2b4c221c65fa9.png" @click="onSecondButtonClick" mode="aspectFit" ></image> </view> </view> </view> <!-- 页面内容 --> <view class="page-content"> </view> </view></template>
<script> export default { data() { return { } }, methods: { // 返回上一页
goBack() { uni.navigateBack() }, // 第一个按钮点击事件
onFirstButtonClick() { console.log('第一个按钮被点击') // 这里可以添加具体的功能逻辑
}, // 第二个按钮点击事件
onSecondButtonClick() { console.log('第二个按钮被点击') // 这里可以添加具体的功能逻辑
} } }</script>
<style>.container { width: 100%; height: 100vh; background-color: #f5f5f5;}
/* 自定义导航栏 */.custom-navbar { position: fixed; top: 0; left: 0; right: 0; z-index: 999; background-color: #ffffff; border-bottom: 1px solid #e5e5e5;}
.navbar-content { display: flex; align-items: center; justify-content: space-between; height: 44px; padding: 0 15px; /* 适配状态栏高度 */ padding-top: var(--status-bar-height, 20px); min-height: calc(44px + var(--status-bar-height, 20px));}
.navbar-left { flex: 0 0 auto; display: flex; align-items: center;}
.back-btn { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;}
.back-icon { font-size: 24px; color: #333333; font-weight: bold;}
.navbar-center { flex: 1; display: flex; align-items: center; justify-content: center;}
.navbar-title { font-size: 18px; font-weight: 500; color: #333333;}
.navbar-right { flex: 0 0 auto; display: flex; align-items: center; gap: 10px;}
.navbar-btn { width: 24px; height: 24px;}
/* 页面内容 */.page-content { padding-top: calc(44px + var(--status-bar-height, 20px) + 1px); min-height: calc(100vh - 44px - var(--status-bar-height, 20px) - 1px);}</style>
|