属性 改变了过渡效果 html `{{!! $html !!}`
Property changed transition effect with html `{{!! $html !!}`
我正在尝试对 livewire & laravel
中的文本制作过渡效果
正在与 {{ $html }} 合作：
<p class="text-gray-600" x-data="{show: false}" x-show.transition.duration.1000ms="show" x-init="setTimeout(() => { show = true })" id="{{ $slide['current']['id'] }}c">{{ '<h1>hi</h1>' }}</p>
但它不适用于 {!! $html !!}}:
<p class="text-gray-600" x-data="{show: false}" x-show.transition.duration.1000ms="show" x-init="setTimeout(() => { show = true })" id="{{ $slide['current']['id'] }}c">{!! '<h1>hi</h1>' !!}</p>
You can't put an <h1> inside a <p> element. The browser will move
it out.
所以我必须将它添加到 <div>
<div class="text-gray-600" x-data="{show: false}" x-show.transition.duration.1000ms="show" x-init="setTimeout(() => { show = true })" id="{{ $slide['current']['id'] }}c">{!! '<h1>hi</h1>' !!}</div>
我正在尝试对 livewire & laravel
中的文本制作过渡效果正在与 {{ $html }} 合作：
<p class="text-gray-600" x-data="{show: false}" x-show.transition.duration.1000ms="show" x-init="setTimeout(() => { show = true })" id="{{ $slide['current']['id'] }}c">{{ '<h1>hi</h1>' }}</p>
但它不适用于 {!! $html !!}}:
<p class="text-gray-600" x-data="{show: false}" x-show.transition.duration.1000ms="show" x-init="setTimeout(() => { show = true })" id="{{ $slide['current']['id'] }}c">{!! '<h1>hi</h1>' !!}</p>
You can't put an
<h1>inside a<p>element. The browser will move it out.
所以我必须将它添加到 <div>
<div class="text-gray-600" x-data="{show: false}" x-show.transition.duration.1000ms="show" x-init="setTimeout(() => { show = true })" id="{{ $slide['current']['id'] }}c">{!! '<h1>hi</h1>' !!}</div>