Tag Archives: Vue.js

ในการสร้าง Chrome Extension หรือเรียกเป็นภาษาไทย "ส่วนขยาย" จะใช้ HTML/CSS/JavaScript ในการเขียน ซึ่งจะคล้ายกับการเขียนเว็บทั่วๆไป ในเมื่อมันเป็น HTML/CSS/JavaScript ก็จับมาเขียนด้วย Vuejs ซะเลย เพื่อให้ง่ายต่อการพัฒนา

...continue reading

Vuex คืออะไร

Vuex เป็นตัวช่วยจัดการ Data flow โดยปกติเวลาเขียนเว็บจะต้องมีการใช้งาน State หรือ Data ที่เก็บข้อมูลใน Component อยู่แล้ว ซึ่ง Vuex จะมาช่วยจัดการอะไรพวกนี้  ทําให้ Code ของเราเป็นระบบ และ ข้อมูลทั้งหมดจะไหลไปในทิศทางเดียวกันทั้งระบบ ลดการเขียน Code ซํ้าซ้อน

...continue reading

ในบทความนี้เราจะมาเรียนรู้การวนลูปแสดงข้อมูลในลักษณะ List ซึ่ง Vue ก็มีเครื่องมือมาให้เราใช้งานได้อย่างง่ายดาย ก็คือ v-for มันสามารถใช้งานได้ทั้ง Array และ Object มาดูตัวอย่างแรกกันเลย ...continue reading

สวัสดีครับ ตอนนี้เป็นตอนที่8 แล้วนะครับ จะเกี่ยวข้องกับ Conditional Rendering ซึ่งก็คือการใช้ if else นั่นเอง โดย Vue ก็ออกแบบมาให้เราใช้งานได้ง่ายครับ โดยเราสามารถใส่ if else ใน Attribute ได้เลย มาดูกันครับว่า Vue ทําอะไรได้บ้าง ...continue reading

ในตอนที่ 7 นี้จะเกี่ยวกับเรื่อง Class and Style Bindings ใน vue.js ครับ ในการจัดการ Class และ Style เราสามารถใช้ v-bind ได้ เพื่อให้เราสามารถใส่ Logic หรือ ตัวแปรลงไปได้ ทําให้เราสามารถทํา Class  และ Style แบบ Dinamic ได้ง่ายขึ้น ...continue reading

ก่อนหน้านี้เราได้เรียนรู้กันไปแล้วว่าใน Template จะจัดการเกี่ยวกับการแสดงผล ซึ่งในบางครั้งเราจําเป็นต้องนํา Logic บางอย่างใส่เข้าไปใน Template ด้วย ซึ่งเราก็จะใส่ไปแบบนี้ ...continue reading

หลังจากที่เราเรียนรู้ Component กันไปแล้ว ถ้ายังจํากันได้ภายใน Component มี Option ตัวนึงชื่อว่า Props ซึ่งมีหน้าที่ รับข้อมูลจากภายนอก Component เข้ามาใช้งานภายใน Component โดยจะรับข้อมูลผ่านทาง Attribute การใช้งาน Props สามารถใช้งานได้หลายรูปแบบ เราจะมาเรียนรู้ไปทีละแบบนะครับ ...continue reading

สวัสดีครับ จะเป็นบทความสั้นๆนะครับ ที่เราจะมาเรียนรู้เกี่ยวกับสอง Option นี่คือ Data และ Methods ซึ่งผมจะอธิบายไปที่ละตัวพร้อมกับยกตัวอย่างครับ ดังนี้ ...continue reading

สวัสดีครับ ในหัวข้อนี้จะเกี่ยวข้องกับรูปแบบการเขียน หรือ Syntax ของ Template ที่อยู่ภายใน Component หรือพูดง่ายๆก็คือการเขียน UI ของ Component นั้นแหละครับ ซึ่งมันจะเขียนเป็น HTML ธรรมดา แต่ก็จะมี Syntax บางอย่างที่จะเขียนในรูปแบบของ Vue ซึ่งจะทําให้เราเขียน Code ได้ง่ายขึ้น ถ้ายังนึกไม่ออกว่า Template มัน ...continue reading

ในบทความตอนที่แล้ว "Vue.js เริ่มต้น ตอน1 (สร้าง Project)" ผมได้อธิบายถึงแนวทางการพัฒนาเว็บด้วย Vue.js ในแบบต่างๆ และการสร้าง Project ด้วย Vue-cli ถ้าใครยังไม่ได้อ่านกลับไปอ่านก่อนเนื่องจากเนื้อหาในบทความนี้เป็นเนื้อหาที่ต่อเนื่องจากบทความที่แล้ว ...continue reading