" 2. Gunakan push(), sintaksnya ialah "push("Jump address""; . Gunakan history(), sintaks "this.props.history.goBack();""/> " 2. Gunakan push(), sintaksnya ialah "push("Jump address""; . Gunakan history(), sintaks "this.props.history.goBack();"">
Rumah > Artikel > hujung hadapan web > Bagaimana untuk melaksanakan lompatan komponen halaman dalam bertindak balas
Kaedah lompat: 1. Gunakan teg Pautan, sintaks "
"; untuk melompat Alamat pemindahan ")"; 3. Gunakan history(), sintaks "this.props.history.goBack();"
Persekitaran pengendalian tutorial ini: sistem Windows 7, bertindak balas versi 17.0.1, komputer Dell G3.
1 Gunakan Pautan dalam react-router-dom untuk mencapai lompatan halaman
Umumnya terpakai. untuk melompat halaman dengan mengklik butang atau komponen lain Penggunaan khusus adalah seperti berikut:
<Link to={{ pathname: '/path/newpath', state: { // 页面跳转要传递的数据,如下 data1: {}, data2: [] }, }} > <Button> 点击跳转 </Button> </Link>
2. Gunakan tekan dalam react-router-redux untuk melompat halaman
react-router-redux mengandungi fungsi berikut, yang biasanya digunakan bersama dengan redux:let param1 = {} dispatch(push("/path/newpath'", param1)); dispatch(replace("/path/newpath'", param1));
3. Gunakan sejarah dalam RouteComponentProps untuk mengembalikan halaman Belakang
biasanya digunakan apabila menyelesaikan operasi tertentu dan perlu kembali ke halaman sebelumnya.this.props.history.goBack();
4. Buka halaman tab baharu dan pintas laluan
Mula-mula tentukan laluan sebagai:path: "/pathname/:param1/:param2/:param3",Klik lompat acara Pergi ke halaman baharu dan buka tab baharu:
window.open(`pathname/${param1}/${param2}/${param3}`)Dapatkan parameter pada laluan pada halaman baharu:
param1: this.props.match.params.param1, param2: this.props.match.params.param2, param3: this.props.match.params.param3,Dapatkan parameter laluan:
path?key1=value1&key2=value2
const query = this.props.match.location.search const arr = query.split('&') // ['?key1=value1', '&key2=value2'] const successCount = arr[0].substr(6) // 'value1' const failedCount = arr[1].substr(6) // 'value2'atau
function GetUrlParam(url, paramName) { var arr = url.split("?"); if (arr.length > 1) { var paramArr= arr[1].split("&"); var arr; for (var i = 0; i < paramArr.length; i++) { arr = paramArr[i].split("="); if (arr != null && arr[0] == paramName) { return arr[1]; } } return ""; }else { return ""; } }Pembelajaran yang disyorkan: "
tutorial video bertindak balas"
Atas ialah kandungan terperinci Bagaimana untuk melaksanakan lompatan komponen halaman dalam bertindak balas. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!