안녕. 미친 자바스크립트!PHP 다이내믹의 전단서를 사용하세요!livewire
6290 단어 livewirePHPLaravelJavaScript
요즘 자바스크립트는 미친 짓이야.다만 시뮬레이터와 프로펠러를 띄우기 위해서는 코드와 복잡성을 지닌 산이 필요하다.그런 거 아니죠?
네, 제가 물어볼게요...
Livewire 인사!
안녕하세요, Livewire!
Livewire는 동적 전단과 (글에서 보듯이) vanilla PHP처럼 간단하게 쓴 Laavel용 전체 겹쳐쓰기 프레임입니다.
흥미가 붙다.
비록 네가 이전에 본 적이 없다 하더라도 코드만 보면 알 수 있다.스노클링을 하고 뛰어라.
...떠도는 낭만!
무슨 말을 하고 싶은지 알아요.시뮬레이터처럼 조금만 움직일 수 있도록 수십 MB, 수천 개의 파일을 위한 nodemodules를 다운로드하는 것은 패키지를 구축하고 만들어야 하는 시대입니다.괴롭다그런 거 아니야.
그런 사람을 위한 틀에서 일한다고 한다.
코드를 보면 알기 쉽다.
Vue.js로 카운터를 만들어 주세요.
counter.vue
<script>
export default {
data: {
count: 0
},
methods: {
increment() {
this.count++
},
decrement() {
this.count--
},
},
}
</script>
<template>
<div>
<button @click="increment">+</button>
<button @click="decrement">-</button>
<span>{{ count }}</span>
</div>
</template>
응, 간단하지만 이 코드를 잘 그리려면 많은 번거로움이 필요해.Livewire를 사용하면, 이렇게.
/app/Http/Livewire/Counter.php
use Livewire\Component;
class Counter extends Component
{
public $count = 0;
public function increment()
{
$this->count++;
}
public function decrement()
{
$this->count--;
}
public function render()
{
return view('livewire.counter');
}
}
/resources/views/livewire/counter.blade.php<div>
<button wire:click="increment">+</button>
<button wire:click="decrement">-</button>
<span>{{ $count }}</span>
</div>
보시오, PHP만 계수기를 실현할 수 있습니다.어때요?뒤에는 어떻게 움직였을까?
Vue.js 및 Reactjs와 그렇게 하는 것은 변하지 않는다.
@click="increment"
중점타increment
방법으로 계수를 업데이트wire:click="increment"
에서 포인트를 받은 increment
메서드, 업데이트$count
이것은 공식 페이지의 소개다.
Vue.js를 모두 바꿀 수는 없지만 (aax 요청을 통해 느리고 애니메이션 등이 어려워요) 대부분의 용례에서 유효합니다.
Laavel Blade Template 엔진을 타고 있기 때문에 Laavel 사용자에게 친절한 일이 좋습니다.
Reference
이 문제에 관하여(안녕. 미친 자바스크립트!PHP 다이내믹의 전단서를 사용하세요!livewire), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/il-m-yamagishi/items/c9293d4cf324e7d2bdf9텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)