首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何在前端使用django-mdeditor呈现markdown内容?

要在前端使用 Django-MDEditor 呈现 Markdown 内容,你需要按照以下步骤操作:

  1. 安装 Django-MDEditor:
代码语言:javascript
复制
pip install django-mdeditor
  1. 在 Django 项目的 settings.py 文件中添加 mdeditorINSTALLED_APPS
代码语言:javascript
复制
INSTALLED_APPS = [
    # ...
    'mdeditor',
    # ...
]
  1. 在项目的 urls.py 文件中添加 MDEditor 的 URL 配置:
代码语言:javascript
复制
from django.urls import path, include

urlpatterns = [
    # ...
    path('mdeditor/', include('mdeditor.urls')),
    # ...
]
  1. 在你的模型中使用 MDEditor 字段。例如,在 models.py 文件中:
代码语言:javascript
复制
from django.db import models
from mdeditor.fields import MDTextFormField

class Article(models.Model):
    title = models.CharField(max_length=100)
    content = MDTextFormField()
  1. 运行迁移命令以应用模型更改:
代码语言:javascript
复制
python manage.py makemigrations
python manage.py migrate
  1. 在你的表单中使用 MDEditor 字段。例如,在 forms.py 文件中:
代码语言:javascript
复制
from django import forms
from mdeditor.widgets import MDEditWidget
from .models import Article

class ArticleForm(forms.ModelForm):
    class Meta:
        model = Article
        fields = ['title', 'content']
        widgets = {
            'content': MDEditWidget(),
        }
  1. 在你的视图中处理表单并渲染 Markdown 内容。例如,在 views.py 文件中:
代码语言:javascript
复制
from django.shortcuts import render
from .models import Article
from .forms import ArticleForm

def article_create(request):
    if request.method == 'POST':
        form = ArticleForm(request.POST)
        if form.is_valid():
            form.save()
            # 重定向或其他操作
    else:
        form = ArticleForm()

    return render(request, 'article_create.html', {'form': form})

def article_detail(request, pk):
    article = Article.objects.get(pk=pk)
    return render(request, 'article_detail.html', {'article': article})
  1. 在你的模板中使用 safe 过滤器呈现 Markdown 内制内容。例如,在 article_detail.html 文件中:
代码语言:javascript
复制
{% extends 'base.html' %}

{% block content %}
  <h1>{{ article.title }}</h1>
  {{ article.content|safe }}
{% endblock %}
页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

领券