Apakah pengetahuan asas Vue+ElementUI+Springboot

1. The Old World Web

Backend

(1) Pada mulanya, backend web pada asasnya ditulis dalam PHP, bahasa skrip yang sangat mudah untuk dibenamkan ke dalam HTML .

(2) Kemudian Java mula menggunakan kuasanya, dan JSP+Servlet menjadi arus perdana.

(3) Saya mendapati Java berbau dan panjang, jadi saya mula merangkum beberapa idea yang biasa digunakan ke dalam kelas, jadi Spring membesar dan mempunyai dua konsep teras: aspek AOP dan penyongsangan kawalan IoC. Kedua-dua idea ini tidak dapat dikalahkan.

AOP: Sebagai contoh, pengecualian mungkin dilemparkan di setiap tempat dalam program kami Pada masa lalu, adalah sangat menyusahkan untuk mencuba dan menangkap di setiap tempat, dan pemprosesan selepas tangkapan adalah serupa. Jika terdapat aspek yang memintas keluar dari Web, semua lalu lintas akan melalui aspek ini Setelah pengecualian dipintas dan dilemparkan, kod ralat yang sepadan akan dikembalikan dibuang, dan tidak ada keperluan untuk menangkap lebih baik Belum lagi kod, kaedah pengendalian pengecualian juga bersatu. Ini hanyalah aplikasi AOP yang paling mudah.

IoC: Spring menyediakan konsep bekas, yang mencipta objek baharu untuk semua kelas yang perlu dijadikan instantiat, dipanggil Bean (serupa dengan tapak ini dalam Wandou Apabila kelas A memerlukan kelas B, Just menyuntik objek kelas B terurus ke dalam kelas A seperti memerah tapak ini. Ini menyahgandingkan gandingan antara kelas Anda boleh mendapatkan apa sahaja yang anda mahukan. kelas pertama. B. Kelas C... Sudah tentu, sebenarnya terdapat banyak hubungan rujukan yang kompleks antara kelas Tertib instantiasi dan pengecualian gelung pergantungan boleh diuruskan oleh Spring.

(4) Memandangkan orang terus menjadi malas, XML Spring tidak lagi mahu ditulis, jadi sesuatu seperti Springboot telah lahir Slogan ialah "Konvensyen lebih besar daripada konfigurasi", dan beberapa parameter asas telah ditetapkan . Jika anda tidak perlu menukarnya, anda boleh menggunakannya dengan merujuk terus pada pom. Jika anda ingin menukarnya, anda hanya perlu mengkonfigurasi parameter pilihan dalam fail application.yml secara mendalam, hanya tulis kacang konfigurasi Sekarang, semua kacang konfigurasi dan application.yml akan disuntik secara automatik, dan tidak perlu menulis XML untuk memberitahu kacang mana nama kelas itu, apakah id itu, bagaimana untuk memulakannya, dsb. . Menggunakan persekitaran pembangunan bersepadu IDEA Jetbrains, menulis Java akan menjadi sangat mudah, jumlah pengekodan akan dikurangkan dan ia akan mudah untuk dikekalkan.

(5) Masa depan: Ia pasti akan menjadi dunia Go.

Front-end

(1) Pada mulanya: HTML+CSS+JS Three King Kongs

(2) Saya mendapati bahawa JS tidak dapat memenuhi keinginan saya, dan mahu membangunkan skrip yang lebih mudah, jadi Jquery sudah keluar.

Oleh kerana HTML mengandungi terlalu banyak pernyataan berulang, bahasa gabungan hadapan dan belakang seperti JSP muncul. Thymeleaf masih tersedia untuk Springboot, dan ia menyediakan pembangun bahagian belakang dengan alat yang diperkenalkan secara khusus kepada orang baru bahagian hadapan.

Pakar bahagian hadapan mendapati bahawa ambang bahagian hadapan adalah terlalu rendah, jadi mereka menggunakan pemikiran "komponen" untuk mengurus kod pendua dan meningkatkan ambang. Sebagai contoh, saya akhirnya menulis Jadual yang sangat cantik menggunakan HTML+CSS+JS, tetapi setiap kali saya menggunakannya, saya perlu menyalin semua kod Jika saya membuat sedikit perubahan, saya perlu menukar semua tempat yang disalin. Jika Jadual ini ialah komponen, saya hanya perlu merujuknya, dan kemudian menghantar data kepadanya, dan ia boleh secara automatik menjadikan HTML dan merujuk CSS dan JS yang berkaitan. Di samping itu, adalah menyusahkan untuk mempertimbangkan penyemak imbas yang serasi setiap kali Jika terdapat skrip, masukkan versi dan penyemak imbas yang hendak disokong, tulis dalam bahasa yang lebih maju, dan kemudian secara automatik menukarnya kepada serasi dengan pelbagai pelayar semasa. kompilasi HTML+CSS+JS asli pelayar, bukankah ini bagus? Ini membawa kepada bahasa bahagian hadapan moden. Asas bahasa hadapan moden ialah React, dan semuanya dijalin dengan JS. React masih agak asli, jadi pelbagai rangka kerja telah diperoleh di atasnya. Yang terkenal ialah Vue dan Ant Design, yang merangkumi beberapa idea biasa dan operasi asas seperti HTML penjanaan JS. Saya benar-benar ingin mengatakan bahawa ia terlalu sukar untuk bermula...

2 Buka pintu kepada dunia baharu Vue

1 🎜>

Node .js ialah persekitaran masa jalan JavaScript yang direka khusus untuk melaksanakan kod JavaScript. Perintah serupa dengan java -jar xxx.jar, seperti melaksanakan nod xxx.js

• npm: pengurusan pakej node.js. Sama seperti Java's Maven dan Gradle, JavaScript juga mempunyai npm, yang digunakan untuk kawalan versi dan merujuk kod JavaScript yang telah ditulis.

• ES6: ECMAScript 6 ialah versi javascript baharu, yang lebih mudah untuk ditulis berbanding javascript asli.

• Babel: digunakan untuk menukar versi js peringkat tinggi seperti ES6 dan ES7 kepada bahasa js versi peringkat rendah untuk memudahkan keserasian skrip dengan pelbagai platform berjalan

• vue-cli: Ia adalah alat baris arahan vue

• vue-router: Terdapat satu konsep penting di bahagian hadapan yang dipanggil "routing", yang sebenarnya menguruskan bagaimana URL halaman melompat. Ini adalah komponen penghalaan Vue.

• pak web: pakej dan memampatkan semua kod projek bahagian hadapan bersama-sama, boleh menyusun bahasa peringkat tinggi (seperti bahasa peringkat tinggi CSS SCSS, LESS), mengurangkan kod redundansi, dan memuatkan fail atas permintaan , anda juga boleh membezakan berbilang konfigurasi persekitaran, memampatkan imej, fon dan fail lain serta beban panas (dengan serta-merta memaparkan kod dalam penyemak imbas selepas menyimpan tanpa memulakan semula perkhidmatan)

2. npm

对比项	npm	maven
仓库名称	registry	repository
官方仓库	http://registry.npmjs.org	https://mvnrepository.com
国内仓库	https://registry.npm.taobao.org	http://maven.aliyun.com/nexus/content/groups/public
配置文件	package.json	pom.xml
配置文件内容	“dependencies”: {“vue”: “^1.0.0”}	……
打包生成的目录	dist	target

Oleh kerana npm sangat popular, npm telah disepadukan dalam versi node.js yang lebih tinggi

3

Mempunyai pemahaman umum tentang apa itu vue.

• Sintaks: vue secara sintaksis serupa dengan versi teg bahasa halaman web dinamik JSP, atau sangat serupa dengan themeleaf.

• Komponen: Semua dalam Vue ialah komponen Anda boleh merangkum HTML+CSS+JS bersama-sama untuk menyesuaikan komponen.

• Penghalaan: Intipatinya ialah, memandangkan URL, komponen apa yang perlu dikembalikan.

• Mengenkapsulkan beberapa fungsi: contohnya, dipasang boleh memproses kandungan apabila halaman web dimuatkan, data boleh mentakrifkan beberapa pembolehubah dan secara automatik menjadikan komponen setempat apabila ia berubah, kaedah boleh menentukan beberapa fungsi js , dsb. dsb.

CSS boleh ditulis dalam SCSS dan bahasa lain Anda boleh menambah kata kunci skop untuk mengehadkan skop css, dan anda hanya perlu mengimport untuk merujuk mana-mana yang lain komponen. Setelah ditakrifkan Komponen boleh ditulis terus dalam bentuk teg HTML, dan parameter dihantar melalui data, contohnya:

<mytitle></mytitle>

Intinya ialah menggunakan bahasa peringkat tinggi ​​untuk menulis HTML+CSS+ JS lebih malas...

4 , element-ui

element-ui ialah UI bahagian hadapan yang dihasilkan oleh Ele.me Ia telah menyediakan beberapa komponen yang indah untuk menyatukan komponen-komponen ini ke dalam laman web tanpa bermula dari awal, saya menulis komponen itu satu persatu.

Komponen ini, seperti butang radio, jadual, bar kemajuan, dll., direka bentuk dengan cantik dan boleh dipaparkan hanya dengan menghantar data. Jika anda rasa ada sesuatu yang tidak sedap dipandang, anda boleh menulis ganti CSS dan menggantikannya sendiri. Ini sangat mudah untuk halaman pertengahan dan halaman belakang yang mempunyai keperluan fungsi yang kuat dan tidak mengambil berat tentang reka bentuk antara muka.

5. Mengapa tidak menggunakan layui

Sejak saya bersentuhan dengan bahagian hadapan, saya selalu menggunakan layui. Kemudian saya mendapati bahawa ia lebih sesuai untuk mengoptimumkan kesan paparan halaman berdasarkan HTML+CSS+JS/Jquery asli, tetapi tidak begitu serasi dengan idea-idea bahasa front-end moden. Ia datang dengan beberapa pratetap kaedah permulaan jQuery dan acara pencetus, yang tidak serasi dengan kaedah penulisan Vue. Selain itu, beberapa komponen seperti petua alat dan popover tidak disertakan.

Atas ialah kandungan terperinci Apakah pengetahuan asas Vue+ElementUI+Springboot. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!