Auxiliares e tags do Edge
Neste guia, aprenderemos sobre os auxiliares e as tags contribuídos para o Edge pelos pacotes oficiais do AdonisJS. Os auxiliares enviados com o Edge não são abordados neste guia e devem fazer referência à documentação do Edge para o mesmo.
request
Referência à instância da solicitação HTTP em andamento. A propriedade só está disponível quando um modelo é renderizado usando o método ctx.view.render
.
{{ request.url() }}
{{ request.input('signature') }}
route
/ signedRoute
Funções auxiliares para criar URL para uma rota usando o construtor de URL. Ao contrário do construtor de URL, os auxiliares de visualização não têm uma API fluente e aceitam os seguintes parâmetros.
Posição | Descrição |
1st | O identificador de rota ou o padrão de rota |
2nd | Os parâmetros de rota são definidos como uma matriz ou um objeto. |
3rd | O objeto options com as seguintes propriedades.
|
<a href="{{ route('posts.show', [post.id]) }}">
View post
</a>
<a href="{{
signedRoute('unsubscribe', [user.id], {
expiresIn: '3 days',
prefixUrl: 'https://blog.adonisjs.com'
})
}}">
Unsubscribe
</a>
app
Referência à instância do aplicativo.
{{ app.getEnvironment() }}
config
Uma função auxiliar para referenciar valores de configuração dentro de modelos do Edge. Você pode usar o método config.has
para verificar se o valor de uma chave existe.
@if(config.has('app.appUrl'))
<a href="{{ config('app.appUrl') }}"> Home </a>
@else
<a href="/"> Home </a>
@end
session
Uma cópia somente leitura do objeto de sessão. Você não pode alterar dados de sessão dentro de modelos do Edge. A propriedade session
só está disponível quando o modelo é renderizado usando o método ctx.view.render
.
Post views: {{ session.get(`post.${post.id}.visits`) }}
flashMessages
Uma cópia somente leitura de session flash messages. A propriedade flashMessages
só está disponível quando o modelo é renderizado usando o método ctx.view.render
.
@if(flashMessages.has('inputErrorsBag.title'))
<p>{{ flashMessages.get('inputErrorsBag.title') }}</p>
@end
@if(flashMessages.has('notification'))
<div class="notification {{ flashMessages.get('notification').type }}">
{{ flashMessages.get('notification').message }}
</div>
@end
old
O método old
é uma abreviação para o método flashMessages.get
.
<input
type="text"
name="email"
value="{{ old('name') || '' }}"
/>
t
O método t
é contribuído pelo pacote @adonisjs/i18n
para exibir traduções usando a classe i18n. O método aceita o identificador da chave de tradução, dados da mensagem e uma mensagem de fallback como parâmetros.
<h1> {{ t('messages.greeting') }} </h1>
i18n
Referência a uma instância da classe I18n configurada usando o locale padrão do aplicativo. No entanto, o DetectUserLocaleMiddleware
substitui essa propriedade por uma instância criada para o locale atual da solicitação HTTP.
{{ i18n.formatCurrency(200, { currency: 'USD' }) }}
auth
Referência à propriedade ctx.auth compartilhada pelo InitializeAuthMiddleware. Você pode usar esta propriedade para acessar informações sobre o usuário conectado.
@if(auth.isAuthenticated)
<p> {{ auth.user.email }} </p>
@end
Se você estiver exibindo as informações do usuário conectado em uma página pública (não protegida pelo middleware auth), talvez você queira primeiro verificar silenciosamente se o usuário está conectado ou não.
{{-- Check if user is logged-in --}}
@eval(await auth.use('web').check())
@if(auth.use('web').isAuthenticated)
<p> {{ auth.use('web').user.email }} </p>
@end
asset
Resolva a URL de um ativo processado pelo Vite. Saiba mais sobre referenciar ativos dentro de modelos Edge.
<img src="{{ asset('resources/images/hero.jpg') }}" />
embedImage
/ embedImageData
Os auxiliares embedImage
e embedImageData
são adicionados pelo pacote mail e estão disponíveis somente ao renderizar um modelo para enviar um e-mail.
<img src="{{
embedImage(app.makePath('assets/hero.jpg'))
}}" />
@flashMessage
A tag @flashMessage
fornece um DX melhor para ler mensagens flash para uma determinada chave condicionalmente.
Em vez de escrever condicionais
@if(flashMessages.has('notification'))
<div class="notification {{ flashMessages.get('notification').type }}">
{{ flashMessages.get('notification').message }}
</div>
@end
Você pode preferir usar a tag
@flashMessage('notification')
<div class="notification {{ $message.type }}">
{{ $message.message }}
</div>
@end
@error
A tag @error
fornece um DX melhor para ler mensagens de erro armazenadas dentro da chave errorsBag
em flashMessages
.
Em vez de escrever condicionais
@if(flashMessages.has('errorsBag.E_BAD_CSRF_TOKEN'))
<p>{{ flashMessages.get('errorsBag.E_BAD_CSRF_TOKEN') }}</p>
@end
Você pode preferir usar a tag
@error('E_BAD_CSRF_TOKEN')
<p>{{ $message }}</p>
@end
@inputError
A tag @inputError
fornece um DX melhor para ler mensagens de erro de validação armazenadas dentro da chave inputErrorsBag
em flashMessages
.
Em vez de escrever condicionais
@if(flashMessages.has('inputErrorsBag.title'))
@each(message in flashMessages.get('inputErrorsBag.title'))
<p>{{ message }}</p>
@end
@end
Você pode preferir usar a tag
@inputError('title')
@each(message in $messages)
<p>{{ message }}</p>
@end
@end
@vite
A tag @vite
aceita uma matriz de caminhos de ponto de entrada e retorna as tags script
e link
para o mesmo. O caminho que você fornece para a tag @vite
deve corresponder exatamente ao caminho registrado dentro do arquivo vite.config.js
.
export default defineConfig({
plugins: [
adonisjs({
entrypoints: ['resources/js/app.js'],
}),
]
})
@vite(['resources/js/app.js'])
Você pode definir os atributos da tag script como o segundo argumento. Por exemplo:
@vite(['resources/js/app.js'], {
defer: true,
})
@viteReactRefresh
A tag @viteReactRefresh
retorna uma tag de script para habilitar o React HMR para o projeto usando o pacote @vitejs/plugin-react.
@viteReactRefresh()
HTML de saída
<script type="module">
import RefreshRuntime from 'http://localhost:5173/@react-refresh'
RefreshRuntime.injectIntoGlobalHook(window)
window.$RefreshReg$ = () => {}
window.$RefreshSig$ = () => (type) => type
window.__vite_plugin_react_preamble_installed__ = true
</script>
@can
/ @cannot
As tags @can
e @cannot
permitem que você escreva verificações de autorização em modelos do Edge referenciando o nome da habilidade ou o nome da política como uma string.
O primeiro argumento é a habilidade ou a referência da política seguida pelos argumentos aceitos pela verificação.
Veja também: Pré-registro de habilidades e políticas
@can('editPost', post)
{{-- Pode editar a postagem --}}
@end
@can('PostPolicy.edit', post)
{{-- Pode editar a postagem --}}
@end
@cannot('editPost', post)
{{-- Não pode editar a postagem --}}
@end
@cannot('editPost', post)
{{-- Não pode editar a postagem --}}
@end