Artikel ini memperkenalkan ide implementasi terbaru saya untuk fungsi kaskade yang serupa di kaskade provinsi dan kota. Untuk memisahkan tanggung jawab, kinerja dan perilaku sebanyak mungkin, fungsi ini dibagi menjadi 2 komponen dan satu daftar tertaut digunakan untuk mengimplementasikan logika kaskade utama. Bagian selanjutnya memiliki efek demonstrasi. Meskipun ini adalah fungsi yang sangat umum, logika implementasi artikel ini jelas dan kodenya mudah dipahami. Ini dipisahkan dari semantik kaskade provinsi dan kota, dan memperhitungkan pemisahan kinerja dan perilaku. Saya harap konten artikel ini dapat membawa nilai referensi untuk pekerjaan Anda. Selamat datang untuk membaca dan memperbaikinya.
Operasi kaskade kaskade
Cascadetype. Operasi Persistence Kegigihan (Simpan)
Cascadetype. Gabungan operasi pembaruan kaskade (merget)
Cascadetype. Refresh Cascade Refresh Operation, Hanya Permintaan dan Dapatkan Operasi
Cascadetype. Hapus operasi penghapusan kaskade
Cascadetype. Semua kaskade semua operasi di atas
Apakah akan menunda pemuatan perayapan pengambilan, defaultnya adalah bahwa sisi pertama segera dimuat, dan lebih banyak sisi adalah penundaan pemuatan
Pemeliharaan Hubungan Mappedby
MappedBy = "ParentID" berarti bahwa atribut ParentID di kelas anak -anak digunakan untuk mempertahankan hubungan. Nama ini harus persis sama dengan nama atribut parentid di kelas anak -anak.
Juga, perlu dicatat bahwa jenis koleksi di kelas induk harus daftar atau ditetapkan, dan tidak dapat diatur ke arraylist, jika tidak kesalahan akan dilaporkan
Efek demonstrasi (unduhan kode, CATATAN: Efek ini memerlukan HTTP untuk dijalankan. Selain itu, data dalam efek adalah data simulasi dan sebenarnya tidak dikembalikan oleh latar belakang, sehingga data pull-down provinsi, kota dan kabupaten yang Anda lihat adalah sama):
Catatan: Artikel ini menggunakan implementasi teknis dari beberapa blog terkait sebelumnya. Jika Anda membutuhkannya, Anda dapat mengklik tautan di bawah ini untuk mempelajarinya:
1) Penjelasan terperinci tentang implementasi warisan JavaScript: menyediakan kelas.js untuk mendefinisikan hubungan warisan antara kelas JavaScript dan kelas konstruksi;
2.
3) Enkapsulasi sekunder komponen proxy Ajax dan Ajax Cache JQuery: Ajaxcache: menyediakan jax.js dan jaxcache.js, menyederhanakan panggilan Ajax dari jQuery, dan proxy cache untuk permintaan klien.
Pertama mari kita pelajari lebih lanjut tentang persyaratan fungsi ini.
1. Analisis fungsional
Fungsi ini diilustrasikan oleh komponen cascading yang berisi tiga item cascading:
1) Setiap item cascading mungkin memerlukan opsi untuk digunakan sebagai prompt input:
Dalam hal ini, opsi kosong dapat dipilih dalam daftar data setiap item cascading (yaitu, yang diminta oleh input):
Mungkin juga tidak perlu digunakan sebagai prompt input:
Dalam hal ini, hanya opsi data yang dapat dipilih dalam daftar data dari setiap item cascading, dan tidak ada opsi kosong yang dapat dipilih:
2) Jika halaman saat ini diminta dari database dan bidang yang sesuai dengan komponen cascading memiliki nilai, maka nilai kueri digemakan pada komponen cascading:
Jika bidang yang sesuai yang ditemukan dalam kueri tidak memiliki nilai, maka dua situasi yang dijelaskan dalam persyaratan titik 1) ditampilkan.
3) Setiap item cascading membentuk hubungan daftar tunggal tertaut dalam struktur data. Daftar data item cascading yang terakhir terkait dengan data yang dipilih oleh item cascading sebelumnya.
4) Mempertimbangkan masalah kinerja, daftar data dari setiap item cascading ditampilkan secara tidak sinkron oleh Ajax.
5) Setelah inisialisasi komponen cascading selesai, daftar item cascading pertama secara otomatis dimuat.
6) Ketika item cascading saat ini berubah, hapus daftar data semua item cascading yang terkait langsung atau tidak langsung. Pada saat yang sama, jika nilai setelah item cascading sebelumnya tidak kosong, daftar data item cascading berikutnya yang secara langsung terkait dengannya akan dimuat secara otomatis. Saat membersihkan daftar data dari item cascading, berhati -hatilah: Jika item cascading perlu menampilkan opsi prompt input, opsi tersebut harus disimpan saat dibersihkan.
7) Kita harus sepenuhnya mempertimbangkan masalah kinerja dan menghindari pemuatan duplikat.
8) Mempertimbangkan masalah pengiriman formulir, ketika item cascading dari komponen cascading berubah, nilai yang dipilih oleh komponen cascading harus tercermin dalam bidang teks tersembunyi, sehingga dapat memfasilitasi pengiriman nilai komponen cascading ke latar belakang melalui bidang teks.
Fungsinya kira -kira seperti di atas.
2. Ide Implementasi
1) Struktur Data
Yang berbeda dari komponen lain adalah memiliki beberapa ketergantungan dengan data di latar belakang. Struktur data yang saya pertimbangkan lebih baik diimplementasikan:
{"id": 1, "Teks": "Beijing", "kode": 110000, "ParentId": 0}, {"id": 2, "Teks": "Provinsi Hebei", "kode": 220000, "ParentID": 0}, {"ID": 3, "Teks": "Henan Province", "Parentid" {"Id": 3, "Text": "Henan", "Parentid", "Parentid", "Parentid": "ParentID": "ID": 3, "TEKP": "TEKP": "TEKP": 3, "ID adalah pengidentifikasi unik dari data, dan hubungan asosiasi antara data dibangun melalui orang tua. Teks dan kode adalah bidang bisnis biasa. Jika kita mengikuti struktur data ini, akan sangat sederhana untuk menanyakan antarmuka daftar data cascading:
// Periksa daftar item kaskade pertama/API/Cascade? ParentId = 0 // Periksa daftar item kaskade kedua berdasarkan nilai yang dipilih oleh item kaskade pertama/API/Cascade? ParentID = 1 // Periksa daftar item kaskade ketiga berdasarkan nilai yang dipilih oleh Cascade kedua/API/API/Parenter?
Struktur ini juga mudah ditangani untuk latar belakang. Meskipun mereka secara struktural merupakan struktur meja berbentuk pohon, semua pertanyaannya berlapis tunggal, sehingga mudah diterapkan.
Ini juga dapat dilihat dari demonstrasi kueri sebelumnya bahwa struktur ini dapat membantu kita menyatukan antarmuka dan parameter kueri data menjadi satu, yang merupakan hal yang sangat nyaman untuk pengembangan komponen. Setelah kami mendapatkan struktur data ini dari latar belakang, kami menguraikan setiap data menjadi opsi, seperti <opsi value = "beijing" data-param-value = "1"> Beijing </ption>. Ini tidak hanya dapat melengkapi tampilan drop-down dari daftar data, tetapi juga mengumpulkan nilai yang dipilih dari item Cascade saat ini melalui fungsi elemen SELECT Form. Akhirnya, ketika item kaskade berubah, kita juga dapat memperoleh opsi yang dipilih, dan menggunakan nilai nilai-param data yang disimpan di atasnya sebagai parameter ParentId untuk memuat daftar item kaskade berikutnya. Ini juga merupakan gagasan tentang kueri data komponen cascading dan penguraian.
Namun, yang perlu dipertimbangkan di sini adalah masalah fleksibilitas. Dalam proyek aktual, struktur data komponen cascading dapat didefinisikan sesuai dengan hubungan asosiasi yang sama seperti ID Parentid, tetapi bidangnya tidak harus disebut kode teks ID Parentid, dan cenderung menjadi bidang lain. Dengan kata lain: Saat mem-parsing data menjadi opsi, bidang yang digunakan untuk teks dan nilai opsi, dan nilai bidang yang digunakan untuk atribut nilai-param data tidak pasti; Nama parameter ParentID yang digunakan saat meminta data tidak bisa mati. Kadang -kadang jika staf backend menulis antarmuka kueri terlebih dahulu dan menggunakan nama lain, Anda tidak dapat meminta seseorang untuk mengubah nama parameternya, karena perlu dikompilasi dan digunakan, yang lebih merepotkan daripada ujung depan; Nilai ParentID = 0 tidak dapat diperbaiki, karena orang tua dari lapisan data pertama dalam proyek aktual mungkin kosong atau -1. Hal -hal ini harus dirancang sebagai opsi. Di satu sisi, nilai default disediakan, dan pengaturan eksternal juga dicadangkan sesuai dengan situasi aktual. Misalnya, dalam implementasi akhir artikel ini, opsi ini didefinisikan seperti ini:
TextField: 'Text', // Nama bidang dalam data yang dikembalikan untuk ditampilkan di elemen <pection>
ValueField: 'Teks', // Nama bidang dalam data yang dikembalikan untuk ditetapkan pada nilai elemen <pection>
Paramfield: 'id', // Saat memanggil antarmuka kueri data, nama bidang yang sesuai dengan data yang akan diteruskan ke latar belakang
ParamName: 'ParentId', // Saat memanggil antarmuka kueri data, nama parameter data dilewatkan setelah URL
DefaultParam: '', // Saat menanyakan item kaskade pertama, nilainya diteruskan ke latar belakang umumnya 0, '', atau -1, dll., Menunjukkan bahwa data di lapisan atas harus ditanyakan
2) Struktur HTML
Menurut Pasal 1 dari analisis fungsional sebelumnya, ada dua jenis struktur HTML awal dari komponen cascading:
<ul id = "LicenseLocation-view"> <li> <pilect> <option value = ""> Pilih provinsi </tiptions
atau
<ul id = "companyLocation-view"> <li> <dect> </decter> </li> <li> <decter> </dectle> </li> <li> <li> <dect> </dectt> </li> </ul>
Satu -satunya perbedaan antara kedua struktur ini adalah apakah opsi yang digunakan sebagai prompt input dikonfigurasi. Perlu juga dicatat bahwa jika opsi kosong ini diperlukan, atribut nilai harus diatur untuk kosong, jika tidak, opsi kosong ini akan mengirimkan informasi prompt opsi ke latar belakang saat mengirimkan formulir.
Hal terpenting tentang kedua struktur ini adalah elemen pilih, yang tidak ada hubungannya dengan UL dan LI. Ul dan Li digunakan untuk UI; Elemen pilih tidak memiliki semantik, dan tidak perlu mengidentifikasi provinsi mana, yang merupakan kota, dan mana yang merupakan distrik atau daerah. Secara fungsional, SELECT mewakili item cascading. Tidak masalah di mana pemilihan ini didefinisikan. Kita hanya perlu memberi tahu komponen cascading mana yang terpilih dari elemen -elemen yang terdiri dari barang -barang cascadingnya. Satu -satunya hal yang perlu diceritakan ke komponen adalah urutan elemen -elemen terpilih ini, tetapi ini biasanya dikendalikan oleh urutan elemen default dalam HTML. Struktur ini dapat membantu kami memisahkan fungsi komponen dari perilaku sebanyak mungkin.
3) Pemisahan Tanggung Jawab dan Penggunaan Daftar Tertaut Tunggal
Dapat dilihat dari bagian sebelumnya bahwa jika komponen kaskade ini dibagi sesuai dengan tanggung jawab, itu dapat dibagi menjadi dua komponen inti, satu bertanggung jawab atas pengelolaan fungsi keseluruhan dan item kaskade internal (cascadeview), dan yang lainnya bertanggung jawab atas implementasi fungsional barang kaskade (cascadeitem). Selain itu, untuk mengimplementasikan logika cascading dengan lebih mudah, kita hanya perlu menghubungkan semua item cascading melalui daftar tertaut. Melalui mode berlangganan publikasi, item cascading terakhir berlangganan pesan bahwa item cascading sebelumnya telah berubah; Ketika item cascading saat ini berubah, pesan diposting untuk memberi tahu item cascading berikutnya untuk memproses logika yang relevan; Melalui peran daftar yang ditautkan, pesan ini dapat dilewati sampai item cascading terakhir. Jika Anda menggambarkannya dalam sebuah gambar, itu akan kira -kira seperti ini:
Yang perlu kita lakukan adalah mengendalikan rilis dan pengiriman kabar baik.
4) Formulir Pengajuan
Untuk mengirimkan nilai komponen cascading dengan mudah ke latar belakang, seluruh komponen cascading dapat diperlakukan secara keseluruhan, dan peristiwa yang diaktifkan disediakan ke luar, di mana peristiwa eksternal dapat memperoleh nilai semua item cascading. Karena ada beberapa kaskade, saat menerbitkan acara yang diaktifkan, acara ini hanya dapat dipicu ketika kaskade berubah.
5) Ajax Cache
Dalam komponen ini, kita perlu mempertimbangkan dua tingkat cache Ajax. Yang pertama adalah di level komponen. Misalnya, saya mengganti item kaskade pertama ke Beijing. Pada saat ini, item kaskade kedua memuat data Beijing. Kemudian saya mengganti item kaskade pertama dari Beijing ke Hebei dan kemudian ke Beijing. Pada saat ini, item kaskade kedua masih menampilkan daftar data yang terkait dari Beijing. Jika kami menyimpan datanya ketika daftar pertama kali dimuat, maka kami tidak perlu memulai permintaan AJAX kali ini; Yang kedua adalah permintaan AJAX. Pada level, jika ada beberapa komponen cascading pada halaman, pertama -tama saya beralih item cascading pertama dari komponen cascading pertama ke Beijing, dan browser memulai permintaan AJAX untuk memuat data. Ketika saya mengganti item cascading pertama dari komponen cascading kedua ke Beijing, browser akan mengirim permintaan lain untuk memuat data. Jika saya menyimpan data yang dikembalikan oleh permintaan AJAX pertama dari komponen pertama terlebih dahulu, ketika komponen kedua menggunakan parameter yang sama untuk meminta antarmuka yang sama, itu akan secara langsung menggunakan cache sebelumnya untuk mengembalikan hasilnya, yang juga dapat mengurangi permintaan AJAX. Tingkat kedua cache Ajax tergantung pada "enkapsulasi sekunder dari jQuery Ajax dan Ajax Cache Proxy Component: Ajaxcache". Untuk komponen, ini hanya mengimplementasikan level pertama cache secara internal, tetapi tidak perlu mempertimbangkan level kedua cache, karena implementasi cache dari level kedua transparan, dan tidak tahu bahwa komponen AJAX yang digunakannya memiliki fungsi cache.
3. Detail Implementasi
Implementasi akhir mencakup tiga komponen, cascadeview, cascadeitem, dan cascadepublicdefaults. Dua yang pertama adalah inti dari komponen, dan yang terakhir hanya digunakan untuk menentukan beberapa opsi. Fungsinya dijelaskan secara rinci dalam komentar cascadeitem. Selain itu, ada komentar yang sangat rinci dalam kode berikut yang menjelaskan peran beberapa kode kunci. Melihat kode berdasarkan persyaratan sebelumnya, itu harus relatif mudah dimengerti. Saya dulu menggunakan teks untuk menjelaskan beberapa detail implementasi, tetapi kemudian saya secara bertahap merasa bahwa metode ini agak tidak berterima kasih. Pertama, bahasa di level detail tidak mudah diatur. Terkadang saya tidak mengungkapkan maknanya. Saya jelas ingin menjelaskan sesuatu dengan jelas, tetapi ternyata menjadi lebih bingung. Setidaknya saya akan merasa seperti ini ketika saya membaca apa yang saya tulis. Kedua, pengembang sendiri memiliki kemampuan untuk membaca kode sumber, dan sebagian besar pengembang aktif bersedia memahami ide implementasi dengan memikirkan kode orang lain; Jadi saya menggunakan anotasi untuk menjelaskan detail implementasi sebagai gantinya :)
CascadepublicDefaults:
define (function () {return {url: '', // Data Query Interface Textfield: 'Text', // Return Data dalam Nama Bidang ValueField: 'Text', // Return Data dalam Nama Bidang yang harus ditampilkan dalam elemen <Opsi> Paramfield: 'Teks', // Kembalikan Data di bidang bidang yang harus ditetapkan pada nilai nilai <Paramfield: 'Text', PARAM, ID, PARAM, PARAM, PARAM, PARAM, PARAM, PARAM FORMERSION, PARAM, PARAM FORMERSION, Nama lapangan dari data yang akan diteruskan ke latar belakang adalah Paramname: 'ParentId', // Saat memanggil antarmuka kueri data, nama parameter data yang lewat setelah URL adalah defaultparam: '', // Ketika menanyakan item kaskade pertama, yang disahkan ke latar belakang umumnya 0, '', atau -1, dll, yang mengindikasikan bahwa Anda ingin yang Anda inginkan yang akan Anda inginkan. Sebagai prompt input, seperti: Pilih suatu provinsi), jika benar, opsi pertama default, SolveiJax tidak akan dihapus saat memuat ulang item kaskade: function (res) {return res;} // Karena item kaskade akan mengirim permintaan yang tidak sinkron saat memuat data, panggilan balik ini digunakan untuk parse respon yang dikembalikan oleh Syingnoy.Cascadeview:
define(function (require, exports, module) {var $ = require('jquery');var Class = require('mod/class');var EventBase = require('mod/eventBase');var PublicDefaults = require('mod/cascadePublicDefaults');var CascadeItem = require('mod/cascadeItem');/*** The function of PublicDefaults is shown in the comments in Komponen cascadeitem*/var defaults = $ .extend ({}, publicDefaults, {$ elemen: tidak terdefinisi, // array item cascaded objek jq, urutan elemen dalam data mewakili semua item cascade. Distrik, Nilai Chaoyang Distrik: '', // String yang dipisahkan oleh ValuesParator mewakili nilai masing -masing pilih pada awal yang diaktifkan: $ .noop // acara ini akan dipicu ketika nilai item cascaded apa pun} (opsi); opts = this.options = this.getOptions (opsi), item = this.items = [], itu = this, $ elements = opts. $ elemen, values = opts.values.split (opts.valueseParator) (ini) (fungsi $ = $ {$ {$ {evar & evalues (evalies) (evalies) (opts.onChanged, ini) (evar & {evalige) (opts.onChanged ('ini) (opts. $ (ini); // Instantiate komponen cascadeitem dan arahkan properti previtem dari setiap contoh ke instance sebelumnya // Atur properti previtem pertama ke cascadeitem yang tidak terdefinisi = cascadeitem baru ($ el, $ .Extend (that.getItemOptions (), {previtem: i == 0? $ .trim (nilai [i])})); items.push (cascadeitem); // Setiap perubahan instance kaskade akan memicu peristiwa perubahan dari komponen cascadeview // luar dapat menangani logika bisnis dalam panggilan balik ini/misalnya, atur nilai semua cascade ke bidang tersembunyi untuk formulir kiriman cascadeitem.on ('cade. {that.trigger ('ubah.cascadeview', that.getValue ());});});}); // Inisialisasi selesai secara otomatis memuat item cascading pertama.length && items (0] .Load ();}, getOptions: function (options) {return $ .Extend ({),}, getOptions: function (function) {return $ .Extend ({},), getOptions: function (options) {return $ .Extend ({},); () {return defaults;}, getItemOptions: function () {var opts = {}, _options = this.options; for (var i in publicDefaults) {if (publicdefaults.hasownproperty (i) & i di _options) {opts.hasownproperty (i) & i in _options) {opts [i] = _OP; Dari semua item cascading, yang merupakan string yang dipisahkan oleh ValuesParator // nilai item cascading kosong tidak akan mengembalikan getValue: function () {var value = []; this.items.foreach (function (item) {var val = $ .trim (item.getValue ()); val! = '' && vale (vale) vale (vale); value.join (this.options.valueseParator);}}, extend: eventBase}); return cascadeview;});Cascadeitem:
define(function (require, exports, module) {var $ = require('jquery');var Class = require('mod/class');var EventBase = require('mod/eventBase');var PublicDefaults = require('mod/cascadePublicDefaults');var AjaxCache = require('mod/ajaxCache');//This is a cacheable Ajax component var Ajax = Ajaxcache baru ();/*** Ada bagian dari opsi yang didefinisikan dalam PublicDefaults, karena komponen cascadeitem tidak akan digunakan secara langsung oleh eksternal* Komponen Cascadeview digunakan secara eksternal, sehingga beberapa opsi harus dipublikasikan. Opsi di PublicDefaults diteruskan ke cascadeitem*/var defaults = $ .Extend ({}, publicDefaults, {previtem: tidak terdefinisi, // arahkan ke nilai item kaskade sebelumnya: '' // nilai pucat: inition: var cascadeitem = class ({instanceMsemers: {oM FULACE: init: init: init: function: in init: function ({class {{{{{{{{{{{{{{{{function: {{{{{function: {{{{{{{{{{{{{{{{{{{{{{classe); this.base; $ el = $ el; function () dari proksi elemen pilih {that.trigger ('ganti That.hascontent && that.clear (); // Jika itu bukan item kaskade pertama dan item kaskade sebelumnya tidak memilih opsi yang valid, itu tidak akan diproses jika (itu.previtem && $ .trim (itu.previtem.getValue ()) == ') kembali; that.load ();}; var varie () () ==. && this.one ('render.cascadeitem', function () {// Tetapkan nilai awal yang. $ el.val (value.split (',')); // beri tahu kaskade berikutnya untuk membersihkan dan memuat ulang data itu.trigger ('diubah.cascadeitem');});}, getoptions, function: (function: (function: (function: (function: (function: (function: (function: (function: (function: {{{{{{{. this.getDefaults (), options);}, getDefaults: function () {return defaults;}, clear: function () {var $ el = this. $ el; $ el.val (''); if (this.options.keepfirstoption) {// simpan opsi pertama $ el.chren () () () () () () () () (). semua $ el.html ('');} // Beri tahu item kaskade berikutnya untuk membersihkan dan memuat ulang data this.trigger ('diubah.cascadeitem'); Karena data item cascading pertama adalah data tingkat atas, kunci yang tetap dan unik digunakan ketika di-cache: root // nama kunci yang digunakan saat di-cache oleh item cascading lainnya terkait dengan opsi yang dipilih oleh seleksi sebelumnya jika (! This.previtem) {paramvalue = opts.defaultParam; datakey = 'root'; this.previtem.getParamValue (); datakey = paramValue;} // Pertama periksa apakah ada data yang dimuat dalam cache data, dan jika ada, itu akan ditampilkan secara langsung untuk menghindari jaxif (datakey di ini.cache) {this.render (this.cache [datakey]);} lainnya {{this.cache [datakey]);} lain paramValue;Ajax.get(opts.url, params).done(function (res) {//resolveAjax This callback is used to parse the data returned by ajax externally//It needs to return a data array var data = opts.resolveAjax(res);if (data) {that.cache[dataKey] = data; that.render (data);}});}}, reender: function (data) {var html = [], opts = this.options; data.foreach (function (item) {html.push (['<opsi value = "', item [opts.valuefield], '" data-param- Value = " Properti Nilai-Param-Param dari Item Opsi [opts.paramfield], '">', item [opts.textfield], '</tipe>']. gabung (''));}); // tambahkan secara dinamis dalam bentuk ditambahkan untuk menghindari opsi pertama // pada akhirnya, atur nilai untuk mengosongkan ini. $ el true; // berarti bahwa ada konten this.trigger ('render.cascadeitem');}, getValue: function () {return ini. $ el.val ();}: getParamValue: function () {return ini.}}};4. Instruksi demo
Tunjukkan struktur kode:
Apa yang dibingkai adalah bagian yang relevan dari demonstrasi. html/regist.html adalah halaman yang menunjukkan efeknya, dan js/app/regist.js adalah entri ke efek demonstrasi JS:
Tentukan (fungsi (membutuhkan, ekspor, modul) {var $ = membutuhkan ('jQuery'); var cascadeview = membutuhkan ('mod/cascadeview'); function publicsetcascadeview (fieldname, opts), this.cascadeview = cascadeview baru ({$ element: $ ('#' + ' +') (new cascadeview ({$ elements: $ ('#'/fieldniew '../api/cascade.json', onchanged: this.onchanged, value: opts.values, KeepFirstoption: this.keepfirstoption, resolveAJAX: function (res) {if (res.code == 200) {return res.data; $ ('input [name = "LicenseLocation"]'), KeepFirstoption: true, setCascadeview: publicsetcascadeview, onchanged: function (e, value) {location_views.licenselocation. $ input.val (value); false, setCascadeview: publicsetcascadeview, onChanged: function (e, value) {location_views.companyoced. $ input.val (value)}}}}; Location_views.companycoced.setCascAdeview ('CompanyLocation', {values: location_views.com Companylocation. $ Input.val ()});});Perhatikan fungsi variabel location_views dalam kode di atas, karena ada beberapa komponen cascading pada halaman. Variabel ini sebenarnya dikelola dengan cara yang sama melalui model kebijakan. Jika Anda tidak melakukan ini, mudah untuk menghasilkan kode duplikat; Formulir ini juga lebih kondusif untuk pemisahan dan enkapsulasi beberapa logika bisnis dalam file entri, seperti tempat di mana logika bisnis diproses.
5. Lainnya
Ini mungkin blog terakhir yang ditulis oleh perusahaan sekarang. Anda harus pergi bekerja di unit baru dalam dua hari. Saya tidak yakin apakah Anda memiliki begitu banyak waktu luang untuk merekam ide kerja yang biasa Anda, tetapi setidaknya Anda telah mengembangkan kebiasaan menulis blog, dan Anda akan memeras waktu jika Anda tidak punya waktu di masa depan. Tujuan tahun ini terutama untuk memperluas pengetahuan dan meningkatkan kualitas kode. Blog selanjutnya akan lebih dalam kategori pengembangan komponen. Saya harap Anda dapat terus memperhatikan situs web Wulin.com di masa mendatang!