You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Odoo技术求助:网站文章列表展示分类树仅显示末级分类

解决Odoo网站文章列表分类树形结构显示问题

我来帮你搞定这个Odoo分类树形展示的问题!你现在的代码只显示了单一级别的分类,核心问题是没有递归渲染子分类层级,所以没法呈现出你想要的树形效果。咱们一步步来修改:

问题分析

你当前的代码仅处理了当前分类的直接子分类,但没有循环遍历所有子层级,也没有递归调用模板渲染更深的分类,自然只能看到最后一级。要实现树形结构,必须用递归模板来处理任意层级的分类。

完整解决方案

1. 编写递归渲染分类的模板片段

先定义一个可复用的递归模板,用来渲染任意分类的子树:

<!-- 递归渲染分类树形的模板片段,建议放在你的模块视图文件中 -->
<t t-name="website_blog.category_tree">
    <ul t-if="category.child_ids" class="category-tree">
        <t t-foreach="category.child_ids" t-as="child">
            <li class="category-item">
                <a t-att-href="keep('/blog/category/' + slug(child))" 
                   class="text-primary d-flex align-items-center gap-1">
                    <!-- 折叠/展开图标 -->
                    <i t-attf-class="fa #{'fa-chevron-down' if child.id in expanded_categories else 'fa-chevron-right'}"></i>
                    <span t-field="child.name"></span>
                </a>
                <!-- 递归调用自身,渲染当前子分类的下一级 -->
                <t t-call="website_blog.category_tree" 
                    t-set="category" t-value="child" 
                    t-set="expanded_categories" t-value="expanded_categories"/>
            </li>
        </t>
    </ul>
</t>

2. 在主模板中调用递归模板并渲染顶级分类

把原来的代码替换成下面的内容,同时处理面包屑和树形结构的初始化:

<div class="row">
    <div class="col-sm-12">
        <!-- 优化面包屑导航,自动显示完整层级 -->
        <ol class="breadcrumb" t-if="category">
            <t t-foreach="category.parent_path.split('/')[:-1]" t-as="parent_id">
                <t t-set="parent_category" t-value="blog.category.browse(int(parent_id))"/>
                <li>
                    <a t-att-href="keep('/blog/category/' + slug(parent_category))" t-field="parent_category.name"/>
                </li>
            </t>
            <li class="active" t-field="category.name"/>
        </ol>
        
        <!-- 分类树形结构容器 -->
        <div class="category-tree-container mt-3">
            <!-- 先渲染所有顶级分类(无父分类的分类) -->
            <t t-foreach="blog.category.search([('parent_id', '=', False)])" t-as="top_category">
                <div class="top-category mb-2">
                    <a t-att-href="keep('/blog/category/' + slug(top_category))" 
                       class="text-primary d-flex align-items-center gap-1">
                        <i t-attf-class="fa #{'fa-chevron-down' if top_category.id in expanded_categories else 'fa-chevron-right'}"></i>
                        <span t-field="top_category.name"></span>
                    </a>
                    <!-- 调用递归模板渲染顶级分类的子树 -->
                    <t t-call="website_blog.category_tree" 
                        t-set="category" t-value="top_category"
                        t-set="expanded_categories" t-value="expanded_categories"/>
                </div>
            </t>
        </div>
    </div>
</div>

3. 在控制器中处理分类展开状态

为了让当前选中的分类及其父级自动展开,需要在对应的控制器方法中计算expanded_categories集合:

# 找到你网站文章列表对应的控制器方法,添加以下逻辑
from odoo import http
from odoo.http import request

class WebsiteBlog(http.Controller):
    @http.route(['/blog/category/<model("blog.category"):category>'], type='http', auth="public", website=True)
    def blog_category(self, category=None, **kwargs):
        expanded_categories = set()
        if category:
            # 遍历当前分类的所有父级,加入展开集合
            current_category = category
            while current_category:
                expanded_categories.add(current_category.id)
                current_category = current_category.parent_id
        
        # 其他原有逻辑...
        
        return request.render('your_module.your_template', {
            'category': category,
            'expanded_categories': expanded_categories,
            # 其他必要变量(比如blog对象等)
        })

4. 添加CSS美化树形结构

最后加一点CSS让树形结构更贴合示例效果:

.category-tree {
    list-style: none;
    padding-left: 1.5rem;
    margin: 0.4rem 0;
}
.category-item {
    margin: 0.3rem 0;
}
.top-category {
    font-weight: 500;
}
.category-tree-container a {
    text-decoration: none;
}
.category-tree-container a:hover {
    text-decoration: underline;
}

关键说明

  • 递归模板:通过t-call自身实现无限层级的分类渲染,不管你的分类有多少级都能完整展示。
  • 展开状态:通过控制器计算当前分类的所有父级,确保进入子分类页面时,父分类自动展开,和示例效果一致。
  • 面包屑优化:利用Odoo分类的parent_path字段自动生成完整的层级面包屑,不用手动拼接。

内容的提问来源于stack exchange,提问作者Boubaker

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.27 09:38:50