小程序底部固定标签栏上面一行排列四个图标，实现点赞、收藏等功能

最新推荐文章于 2023-09-11 10:06:14 发布

time ocean

最新推荐文章于 2023-09-11 10:06:14 发布

阅读量1.3k

点赞数 2

文章标签：小程序底部固定图标页面底部一行多个图标标签栏导航栏

本文链接：https://blog.csdn.net/weixin_43889700/article/details/116466031

版权

本文介绍了如何在小程序中实现底部固定标签栏，该栏包含四个图标，用于点赞、收藏、删除和编辑操作。通过使用view和image标签，并调整样式，确保这些图标在页面底部始终保持固定，不会随滚动而移动。在尝试自定义导航栏未果后，作者最终通过调整view组件的CSS样式来达成目标。

摘要由CSDN通过智能技术生成

需求：在界面最底部固定一个标签栏，上面有四个图标，完成点赞收藏删除编辑等功能，不随界面滑动而改变位置

预期结果：

在这里插入图片描述

方法：利用view image标签

代码：

wxml:

<view class="bottom_naviga">
  <view class="editor" bindtap="editorArticle">
    <image src="{
  {editor}}"></image>
    <view class="txt">编辑</view>
  </view>
  <view class="delete" bindtap="deleteArticle">
    <image src="{
  {delete}}"></image>
    <view class="dtxt">删除</view>
  </view>
  <view class="star" bindtap="isStar">
    <image src="{
  {star}}"></image>