Django QuerySet输出格式化：移除类型标识适配JS图表

嘿，刚接触Django遇到这种数据序列化的问题太正常了！我之前做基金图表可视化的时候也踩过一模一样的坑，给你几个实用的解决方案，帮你把数据转成JS能直接识别的格式：

方法一：给模型添加自定义序列化方法（最灵活） #

直接在你的FundPrice模型里写一个方法，把数据库里的date和Decimal类型转成JS友好的格式，后端处理完再传给模板就不会有那些奇怪的标识了。

示例代码：

from django.db import models
from decimal import Decimal

class FundPrice(models.Model):
    fund_code = models.CharField(max_length=10)
    price_date = models.DateField()
    net_value = models.DecimalField(max_digits=10, decimal_places=4)

    def to_dict(self):
        """把模型实例转成JS可处理的字典"""
        return {
            'fund_code': self.fund_code,
            'price_date': self.price_date.strftime('%Y-%m-%d'),  # 转成标准日期字符串
            'net_value': float(self.net_value)  # 转成float给JS计算，要精度的话用str(self.net_value)
        }

然后在视图里查询数据后，调用这个方法转成字典列表：

def fund_chart_view(request):
    # 按日期排序查询数据
    fund_prices = FundPrice.objects.all().order_by('price_date')
    # 格式化数据
    formatted_data = [price.to_dict() for price in fund_prices]
    return render(request, 'your_template.html', {'fund_prices': formatted_data})

模板里用Django的json_script过滤器安全地传给JS：

{{ fund_prices|json_script:"fund-price-data" }}

<script>
// 从DOM中读取格式化后的数据
const fundData = JSON.parse(document.getElementById('fund-price-data').textContent);
// 接下来就可以用这个数据渲染你的JS图表啦，比如ECharts、Chart.js
console.log(fundData); // 看看是不是已经没有datetime/Decimal标识了
</script>

方法二：用Django自带的序列化器 #

如果不想写自定义方法，也可以用Django内置的serializers模块直接序列化数据，它会自动处理日期和Decimal类型：

视图代码：

from django.core import serializers
from django.shortcuts import render

def fund_chart_view(request):
    fund_prices = FundPrice.objects.all().order_by('price_date')
    # 指定序列化的字段，转成JSON格式
    serialized_data = serializers.serialize(
        'json',
        fund_prices,
        fields=('fund_code', 'price_date', 'net_value')
    )
    return render(request, 'your_template.html', {'serialized_data': serialized_data})

模板里直接把序列化后的JSON传给JS，记得加|safe过滤器避免转义：

<script>
// 直接使用序列化后的JSON数据
const fundData = {{ serialized_data|safe }};
// 后续处理图表逻辑
</script>

方法三：模板内手动格式化（不推荐） #

如果只是小范围使用，也可以在模板循环里逐个格式化字段，但这种方式会让模板逻辑变复杂，维护起来麻烦，不推荐大面积使用：

<script>
const fundData = [
{% for price in fund_prices %}
    {
        "date": "{{ price.price_date }}",
        "value": {{ price.net_value|floatformat:4 }}
    }{% if not forloop.last %},{% endif %}
{% endfor %}
];
</script>

为什么会出现这个问题？ #

你直接用{{ fund_prices }}输出的是Django QuerySet中对象的repr()结果，也就是Python对象的字符串表示，所以会带datetime.date()、Decimal()这些标识，JS根本不认识这种格式，必须转成JS原生的字符串、数字类型才行。

如果需要保留Decimal的高精度（比如金融数据），记得不要转成float，用字符串格式传递，JS里如果需要计算再转成Number类型，避免精度丢失哦！

内容的提问来源于stack exchange，提问作者ati