HarmonyOS 鸿蒙Next中NavigationMenuItem是否支持纯文本

HarmonyOS 鸿蒙Next中NavigationMenuItem是否支持纯文本

build() {
  NavDestination() {
    ...
    menus([menu])
  }
}

let menu: NavigationMenuItem = {
  'value': "密码登录", 'action': () => {
  }
}

代码是这么写的，但右上角不显示「密码登录」，只显示一个圆

3 回复

NavigationMenuItem 仅支持展示图标，通过icon字段引入图标。

具体使用方法可以参考文档：https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-basic-components-navigation-V5#navigationmenuitem%E7%B1%BB%E5%9E%8B%E8%AF%B4%E6%98%8E

参考官方文档，menus不传数组，传自定义组件就能实现文字菜单的需求，可以参考下面的demo：

import { router } from '@kit.ArkUI'

function overBuilder() {
  Row() {
    Text('密码')
      .onClick(() => {
        router.pushUrl({ url: 'pages/Login' })
      })
      .margin(10)
      .fontSize(20)
    Text('游客')
      .onClick(() => {
        router.pushUrl({ url: 'pages/Login' })
      })
      .fontSize(20)
      .margin(10)
    Text('手机')
      .onClick(() => {
        router.pushUrl({ url: 'pages/Login' })
      })
      .fontSize(20)
      .margin(10)
  }
}

@Entry
@Component
struct NavigationMenuItemPage {
  build() {
    Column() {
      Navigation() {
        Text('点击右上角文字跳转')
          .fontSize(30)
      }
      .menus(overBuilder)
    }
  }
}

更多关于HarmonyOS 鸿蒙Next中NavigationMenuItem是否支持纯文本的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next中，NavigationMenuItem支持纯文本。NavigationMenuItem是用于导航菜单的组件，可以通过设置其text属性来显示纯文本内容。开发者可以在布局文件中直接定义NavigationMenuItem的文本内容，或者在代码中动态设置文本。例如，在XML布局文件中，可以通过ohos:text属性指定文本内容，或者在代码中使用setText()方法来设置文本。NavigationMenuItem的设计允许灵活地展示纯文本，满足不同的UI需求。

在HarmonyOS（鸿蒙）的Next版本中，NavigationMenuItem 组件主要用于导航菜单中的项，通常可以包含图标和文本。虽然官方文档没有明确说明是否支持纯文本，但根据其设计模式和常见使用场景，NavigationMenuItem 主要支持图标和文本的组合。如果你需要纯文本的菜单项，建议使用 Text 组件或其他更适合的控件来实现。

回到顶部