您的浏览器需要启用 JavaScript 才能正常访问此网站。
萨龙网络
登录
首页-WordPress文章-WordPress-正文

WordPress+Nuxt3前后端分离项目,实现不限层级的多维数组菜单

萨龙龙萨龙龙WordPress3年前213.80W

使用 WordPress+Nuxt3做前后端分离项目时,菜单需要多维数组,且不限层级,可以使用递归函数很方便地将 wp_get_nav_menu_items 返回的对象数组转换为多维数组,实现不限层级的转换。

/**
 * 输出菜单为多维数组
 * 不限层级
 *
 * @param [type] $items
 * @param integer $parent_id
 * @return void
 * @DateTime 2023-04-25
 * @Author 萨龙龙 @ admin@salongweb.com
 * @copyright 萨龙网络:https://api.salongweb.com
 * @version 1.0
 */
function salong_convert_menu_items_to_array($items, $parent_id = 0)
{
    $menu_items = array();

    foreach ($items as $item) {
        if ((int) $item->menu_item_parent === $parent_id) {
            $menu_item = array(
                'id'       => $item->ID,
                'title'    => $item->title,
                'url'      => $item->url,
                'children' => array(),
            );

            $children = salong_convert_menu_items_to_array($items, $item->ID);

            if (!empty($children)) {
                $menu_item['children'] = $children;
            }

            $menu_items[] = $menu_item;
        }
    }

    return $menu_items;
}


$menu_locations   = get_nav_menu_locations();                         // 获取换所有菜单项
$header_menu_id   = $menu_locations['header-menu'];                   // 头部菜单 ID
$menu_items       = wp_get_nav_menu_items($header_menu_id);
$menu_items_array = salong_convert_menu_items_to_array($menu_items);

print_r($menu_items_array);
标签:
本文原创,作者:萨龙龙,其版权均为萨龙网络所有。
如需转载,请注明出处:https://salongweb.com/wordpress-nuxt3-menu-multidimensional-arrays.html
萨龙龙

萨龙龙

侠客
一个平平常常的人,热爱生活、旅行和摄影,骑行去过西藏,一直计划再去。14年从江西骑行来到大理,现栖居于洱海边,食人间烟火,过简单生活,做简约设计!
1422.46M457.22W4.42W
加载中…
分享:
WordPress 使用 wp_set_password 重置用户密码
WordPress 使用 wp_set_password 重置用户密码上一篇
WordPress+Nuxt.js+Vue.js开发的前端node项目被停止的处理方案下一篇
WordPress+Nuxt.js+Vue.js开发的前端node项目被停止的处理方案
相关文章
总数:115

修改Buddypress中管理员的显示名与用户名区别开提高账户安全

Buddypress社区中有很多地方会直接显示用户登录名,比如用户个人主题中的名称和链接中,所有来访的用户都知道了管理员的用户名,对于小人知道了…
萨龙龙萨龙龙Buddypress, WordPress11年前001.77W0

WordPress 从不需要的页面禁用 WooCommerce 样式和脚本

WooCommerce 在每个页面上加载三个核心CSS样式表,并在WordPress站点上安装时发布。可以通过从不需要它的页面和内容中删除样式和…
萨龙龙萨龙龙WooCommerce7年前001.92W0

WooCommerce 通过woocommerce_cart_item_thumbnail钩子修改购物车缩略图

在开发基于 WooCommerce 的商城主题时,我们一般会将模板文件添加到主题中来进行修改,对于有钩子或接口的地方,就没有必要再修改模板代码了…
萨龙龙萨龙龙WooCommerce6年前001.77W0

WordPress 主题 Slearn Pro 产品插件之属性设置

产品属性可在后台「产品——产品选项——属性」中单独设置(也可在编辑产品时再次添加),有三种类型:文本、颜色和图片,在前台也是以这三种方式来显示。…
萨龙龙萨龙龙WordPress3年前002.66W0

萨龙网络站点群所有网站使用https访问

HTTPS(全称:Hyper Text Transfer Protocol over Secure Socket Layer),是以安全为目标的…
萨龙龙萨龙龙WordPress10年前001.56W0

WordPress 插入页面函数 wp_insert_post

萨龙网络已经开发了很多 WordPress 主题,LensNews 主题要创建的页面较多,所以导致很多用户来咨询如何设置用户中心,在最新上线的 …
萨龙龙萨龙龙WordPress8年前002.30W0

WordPress 主题感染恶意代码function _check_active_widgets

萨龙龙开发主题这么久,第一次感染恶意代码,整个 WordPress 下的主题 functions.php 都被插入了一大段函数代码,百度一下也发…
萨龙龙萨龙龙WordPress8年前001.76W0

WordPress主题使用jQuery插件Isotope添加作品集筛选功能

上一篇文章我们介绍了Isotope,功能强大,效果出众的jQuery插件,但是文章中的代码并不能使用在项目中,所以今天通过Wordpress主题…
萨龙龙萨龙龙jQuery插件, WordPress10年前002.03W0

WordPress强大的开源后台框架Redux Framework介绍与使用

开发一个WP主题有了前端页面设计的美观与布局外,后台选项也是相当重要的一个组成部分,好的后台框架在使用主题时方便快捷的设置各个功能,也让主题开发…
萨龙龙萨龙龙WordPress10年前002.49W0

如何把WordPress数据迁移至WordPress MU

前面我们介绍了如果安装WordPress MU,安装完成后我们就需要把每个独立站点的数据转移到MU中,在MU中最原始的站点数据是不需要改动,只需…
萨龙龙萨龙龙WordPress11年前001.53W0

WordPress龙霄主题对象存储功能完全指南:告别服务器存储瓶颈,开启云端加速时代

龙霄主题内置的原生对象存储功能模块,彻底解决了这一痛点。该模块深度集成了阿里云 OSS、腾讯云 COS、七牛云 Kodo 三大主流云存储服务商,…
萨龙龙萨龙龙WordPress2个月前009220

WordPress附件函数wp_get_attachment_metadata简码获取照片EXIF信息

自动获取照片的EXIF信息,很多大型的摄影论坛都有这个功能,对于摄影爱好者来说是一个很实用的功能。萨龙龙开发的Deephoto主题和Neatim…
萨龙龙萨龙龙WordPress11年前001.47W0
评论表单游客 您好,欢迎参与讨论。
加载中…
评论列表
总数:0
萨龙网络
没有相关内容