1
resposta

ULR utilizando um charfield como parâmetro.

No curso anterior foi mostrado a questão de rotas de receita por id, mas caso eu queria fazer uma página de receitas com todas as receitas de um tipo especifico, para isso utilizar na url "app/tipos/nome-tipo" ao invés de id. Eu cheguei a ver como utilizar o str:get_p_url, mas não consegui filtrar por esse campo.

Agradeço desde já.

1 resposta

Oiii, como você está?

Peço desculpas pela demora em obter um retorno.

Quando utilizamos uma string como parâmetro da URL, nomeamos isso de slug, que basicamente é um pequeno rótulo para a URL, que pode conter letras, números, hífens, dentre outros.

Para a utilização de slugs, trabalharemos com as urls, views e template do nosso aplicativo e para esse exemplo, tomaremos como base o app de receitas, então, todas as operações mostradas abaixo serão feitas dentro da pasta de receitas.

O primeiro passo é adicionar a rota em nosso arquivo de urls.py, como mostro abaixo:

path('tipo/<slug:slug>/', views.tipo, name='tipo')

Tendo como base essa rota, o que dizemos ao django é que iremos acessar uma rota similar a esta: localhost:8000/tipo/nome_da_categoria. Se a categoria for doce, nossa rota será:

localhost:8000/tipo/doce

Com a rota cadastrada, iremos fazê-la de fato funcionar e isso irá ocorrer através da nossa view. No arquivo de view.py, adicione a função que fiiltra as receitas por categoria de acordo com o slug passado:

def tipo(request, slug):

    categorias = Receita.objects.filter(publicada=True).filter(categoria__iexact=slug)
    dados = {
        'categorias': categorias
    }
    return render(request, 'busca_tipos.html', dados)

Vale ressaltar que o parâmetro __iexact irá retornar a categoria passada como parâmetro caso seja a palavra exata cadastrada no banco, não diferenciando maiúsculas e minúsculas.

Após isso, precisaremos adicionar um template html responsável por renderizar esse filtro da view que criamos, então, crie o arquivo busca_tipo.html dentro da pasta receitas/template, ele conterá o seguinte conteúdo:

{% extends 'base.html' %}
{% load static %}
{% block content %}
<div id="preloader">
    <i class="circle-preloader"></i>
    <img src="{% static 'img/core-img/pizza.png' %}" alt="">
</div>

{% include 'partials/_busca.html' %}

{% include 'partials/_menu.html' %}


<section class="best-receipe-area">
    <div class="container">
        <div class="row">
            {% if categorias %}
            {% for categoria in categorias  %}
            <div class="col-12 col-sm-6 col-lg-4">
                <div class="single-best-receipe-area mb-30">
                    {% if categoria.foto_receita == '' %}
                        <img src="{% static 'img/bg-img/foto_receita.png' %}" alt="">
                    {% else %}
                        <img src="{{ categoria.foto_receita.url }}" alt="">
                    {% endif %}
                    <div class="receipe-content">
                        <a href="{% url 'receita' categoria.id %}">
                            <h5>{{ categoria.nome_receita }}</h5>
                        </a>
                    </div>
                </div>
            </div>
        {% endfor %}
        {% else %}
        <div class="col-12 col-sm-6 col-lg-4">
            <p>Receita não encontrada</p>
        </div>
        {% endif %}
        </div>
    </div>
</section>

{% include 'partials/_footer.html' %}
{% endblock %}

Após isso, você conseguirá acessar a URL usando strings e obter o retorno com o filtro desejado. Abaixo, uma demonstração dessa funcionalidade:

Início da transcrição. Esse GIF contém o teste de funcionamento da implementação descrita anteriormente, o usuário realiza o teste usando o navegador Chrome, o usuário usa a barra de endereço para acessar o caminho localhost:8000/tipo/salgado é exibido as receitas da categoria salgado, logo após ele acessa o caminho localhost:8000/tipo/doce, sendo exibido as receitas da categoria doce. Final da transcrição.

Espero ter ajudado. Conte sempre com a Alura para evoluir seus estudos.

Fico à disposição.

Abraços e bons estudos!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!