react laravel
0.14
ด้วย react-laravel คุณจะสามารถใช้ส่วนประกอบ ReactJS ได้จากมุมมอง Blade ของคุณ พร้อมตัวเลือกการเรนเดอร์ฝั่งเซิร์ฟเวอร์ และใช้ส่วนประกอบเหล่านั้นบนฝั่งไคลเอ็นต์ด้วย React เนื่องจาก JavaScript ที่ไม่สร้างความรำคาญ
สิ่งสำคัญคือต้องรู้ว่า react-laravel มีการพึ่งพาทางอ้อมกับส่วนขยาย v8js PHP
คุณสามารถดูวิธีการติดตั้งได้ที่นี่: วิธีติดตั้ง v8js
ตั้งค่า minimum-stability ของ composer.json ของคุณเป็น dev โดยเพิ่มสิ่งนี้:
"ความเสถียรขั้นต่ำ": "dev"
จากนั้นรัน:
$ ผู้แต่งต้องการ talyssonoc/react-laravel:0.11
หลังจากนั้นคุณควรเพิ่มสิ่งนี้ให้กับผู้ให้บริการของคุณที่ไฟล์ config/app.php ของแอป Laravel ของคุณ:
'ReactReactServiceProvider'
แล้วรัน:
ผู้จำหน่าย php artisan: เผยแพร่
และไฟล์ react.php จะอยู่ที่โฟลเดอร์ config ของแอปของคุณ
หลังจากการติดตั้งและกำหนดค่า คุณจะสามารถใช้คำสั่ง @react_component ในมุมมองของคุณได้
คำสั่ง @react_component ยอมรับ 3 อาร์กิวเมนต์:
@react_component(<componentName>[, อุปกรณ์ประกอบฉาก, ตัวเลือก]) //example
@react_component('Message', [ 'title' => 'Hello, World' ], [ 'prerender' => true ]) // ตัวอย่างการใช้คอมโพเนนต์เนมสเปซ
@react_component('Acme.Message', [ 'title' => 'สวัสดีชาวโลก' ], [ 'prerender' => true ]) componentName : คือชื่อของตัวแปรส่วนกลางที่เก็บส่วนประกอบของคุณ เมื่อใช้คอมโพเนนต์เนมสเปซ คุณอาจใช้เครื่องหมายจุดสำหรับชื่อคอมโพเนนต์
props : การเชื่อมโยงของ props ที่จะถูกส่งไปยังองค์ประกอบของคุณ
options : อาร์เรย์เชื่อมโยงของตัวเลือกที่คุณสามารถส่งผ่านไปยัง react-laravel :
prerender : บอก react-laravel ให้เรนเดอร์ส่วนประกอบฝั่งเซิร์ฟเวอร์ของคุณ จากนั้นเพียง เมานต์ มันบนฝั่งไคลเอ็นต์ ค่าเริ่มต้นเป็น จริง
tag : แท็กขององค์ประกอบที่จะเก็บองค์ประกอบของคุณ ค่าเริ่มต้นเป็น 'div'
แอตทริบิวต์ html : แอตทริบิวต์ HTML ที่ถูกต้องอื่นๆ ที่จะถูกเพิ่มลงในองค์ประกอบ wrapper ของส่วนประกอบของคุณ ตัวอย่าง: 'id' => 'my_component'
ส่วนประกอบทั้งหมดของคุณควรอยู่ภายใน public/js/components.js (คุณสามารถกำหนดค่าได้ ดูด้านล่าง) และเป็นสากล
คุณต้องรวม react.js , react-dom.js และ react_ujs.js (ตามลำดับนี้) ในมุมมองของคุณ คุณสามารถต่อไฟล์เหล่านี้เข้าด้วยกันได้โดยใช้ laravel-elixir
react-laravel จัดเตรียมการติดตั้ง ReactJS และไฟล์ react_us.js ซึ่งจะอยู่ที่โฟลเดอร์ public/vendor/react-laravel หลังจากที่คุณติดตั้ง react-laravel และรัน:
$ php ผู้ขายช่างฝีมือ: เผยแพร่ --force
สำหรับการใช้ไฟล์ที่ได้รับจาก react-laravel และไฟล์ components.js ให้เพิ่มสิ่งนี้ลงในมุมมองของคุณ:
<script src="{{ สินทรัพย์('ผู้ขาย/react-laravel/react.js') }}"></script>
<script src="{{ สินทรัพย์('ผู้ขาย/react-laravel/react-dom.js') }}"></script>
<script src="{{ สินทรัพย์('js/components.js') }}"></script>
<script src="{{ สินทรัพย์('ผู้ขาย/react-laravel/react_ujs.js') }}"></script> หากคุณจะใช้เวอร์ชันอื่นจากเวอร์ชันที่ react-laravel ให้มา (ดู composer.json ) คุณจะต้องกำหนดค่าเวอร์ชันนั้น (ดูด้านล่าง)
คุณสามารถเปลี่ยนการตั้งค่าเป็น react-laravel ได้ที่ไฟล์ config/react.php :
กลับ ['แหล่งที่มา' => 'path_for_react.js','dom-source' => 'path_for_react-dom.js','dom-server-source' => 'path_for_react-dom-server.js','ส่วนประกอบ' => [ 'path_for_file_containing_your_components.js' ] -
ทั้งหมดเป็นทางเลือก
source : ค่าเริ่มต้นเป็น public/vendor/react-laravel/react.js
dom-source : ค่าเริ่มต้นเป็น public/vendor/react-laravel/react-dom.js
dom-server-source : ค่าเริ่มต้นเป็น public/vendor/react-laravel/react-dom-server.js
components : ค่าเริ่มต้นเป็น public/js/components.js อาจระบุไฟล์คอมโพเนนต์หลายไฟล์ได้ที่นี่
ไฟล์ components.js js ของคุณควรรวมอยู่ในมุมมองของคุณด้วย และส่วนประกอบทั้งหมดของคุณจะต้องอยู่ที่วัตถุ window
แพ็คเกจนี้ได้รับแรงบันดาลใจจากรางรีแอค
