Vue.jsを使っていますが、Element UIでPaginationを実装したいです。
ただ、公式にあるように下記のコードを貼り付けただけで当然動かず、表と連動させたいのですが、どのようにすれば良いのでしょうか?
el-paginationと表の関連付け方を教えて欲しいです。
<div class="block"> <el-pagination layout="prev, pager, next" :total="50"> </el-pagination> </div>
ちなみに表は下記のようなものです。
<table> <tbody> <tr> <th>●●●</th> <th>▲▲▲</th> <th>■■■</th> </tr> <tr v-for="e in results"> <td>{{ e["●●●"] }}</td> <td>{{ e["▲▲▲"] }}</td> <td>{{ e["■■■"][0] }}</td> </tr> </tbody> </table>
Script部分です
<script> let alert = document.getElementsByClassName("errors-list"); let alert_box = document.getElementsByClassName("error-box"); import axios from 'axios'; export default{ data: function(){ return{ errors: [], results: [], word: "" } }, methods: { exec: function(){ this.errors.length = 0; if(!this.word){ this.errors.push("文字を入力してください"); } if(this.errors.length){ for(let i = 0; i < alert.length; i++){ alert[i].style.display="block"; } setTimeout(function(){ for(let i = 0; i < alert.length; i++){ alert[i].style.display="none"; } },3000); return; } axios.get('/api/v1/searches',{ params: { word: this.word }, }) .then((response) => { this.results.length = 0; if(!response.data.length){ for(let i = 0; i < alert.length; i++){ alert[i].style.display="block"; } this.errors.push("検索結果が存在しません"); setTimeout(function(){ for(let i = 0; i < alert.length; i++){ alert[i].style.display="none"; } },3000); } for(let i = 0; i < response.data.length; i++) { this.results.push(response.data[i]); } }, (error) => { console.log(error); }); } } }; </script>
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2021/04/15 01:42