页码的条数无法显示 显示0条数据 total也写了 就算是检查不出有什么问题 初步判断是不是this.noticeList()的问题?
你的初始的total的总数可以写 null,然后赋值的时候看下是字符串还是数值类型
你现在贴出来的代码显示total就是0,能截一下你的过去数据的那个方法吗?noticeList()
<template>
<div class="box">
<div class="big-div">
<img src="../assets/img/navs.png" id="imgs" />
<img src="../assets/img/head.png" id="logos" />
<div id="nav">
<el-button id="logns" @click="login" v-if="!$store.state.sessionId"
><span id="btn-color">登录</span></el-button
>
<el-button id="lognes" @click="register" v-if="!$store.state.sessionId"
><span id="btn-color">注册</span></el-button
>
<!-- <el-button id="logns" @click="logout" v-if="$store.state.sessionId"
><span id="btn-color">退出登录</span></el-button
> -->
<div class="contents">
<i class="iconfont icon-CRMzititubiao-" style="margin-left: 70px"></i
>招聘公告
<!-- <button id="mores" @click="more">更多</button> -->
<el-table
style="width: 80%; height: 300px; margin-left: 70px"
:data="noticeList"
stripe
>
<el-table-column
label="通知名称"
prop="recruitName"
></el-table-column>
<el-table-column
label="编辑时间"
prop="recruitDate"
></el-table-column>
<el-table-column
label="发布时间"
prop="releaseDate"
></el-table-column>
<el-table-column>
<template slot-scope="scope">
<el-button type="text" @click="showNoticeDetail(scope.row)"
>查看详情</el-button
>
<el-dialog title="详情信息" :visible.sync="dialogTableVisible">
<!-- 富文本编辑器组件 -->
<quill-editor
v-model="recruitDetail"
ref="myQuillEditor"
:options="editorOption"
@blur="onEditorBlur($event)"
@focus="onEditorFocus($event)"
@change="onEditorChange($event)"
>
</quill-editor>
<!-- <el-input
id="texarea"
type="textarea"
:rows="5"
v-model="recruitDetail"
style="resize: none"
v-html="recruitDetail"
/> -->
<!-- <div>{{ recruitDetail }}</div> -->
<!-- 富文本编辑器组件 -->
<el-table :data="fileList" style="width: 100%; height: 200px">
<el-table-column
prop="fileName"
label="文件名"
style="width: 30%"
@click="text"
>
</el-table-column>
<!-- <el-table-column
prop="fileUrl"
label="文件路径"
style="width: 40%"
>
<template slot-scope="scope">
<a
@click="downloadFile(scope.row.fileUrl)"
href="javascript:;"
target="_blank"
>{{ scope.row.fileUrl }}</a
>
</template>
</el-table-column> -->
<el-table-column
prop="fileSize"
label="大小"
style="width: 40%"
>
</el-table-column>
</el-table>
</el-dialog>
</template>
</el-table-column>
</el-table>
<!-- 分页区域 -->
<el-pagination
style="margin-left: 70px; margin-top: 20px"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="queryInfo.pagenum"
:page-sizes="[1, 2, 5, 10]"
:page-size="queryInfo.pagesize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
>
</el-pagination>
<!-- 分页区域 -->
<!-- <div class="content_2">
<i class="el-icon-message-solid" style="margin-left: 70px"></i>
<span id="announcement">招聘结果通知</span>
<button id="more" @click="more">更多</button>
<el-table style="width: 80%; margin-left: 70px; height: 300px">
<el-table-column
prop="date"
label=" 广东省省直机关及其直属机构2021年考试录用公务员面试、体检公告"
width="1200"
>
<template slot="header" slot-scope="scope">
<i class="el-icon-menu"></i>
</template>
</el-table-column>
<el-table-column prop="date"></el-table-column>
</el-table>
</div> -->
</div>
</div>
</div>
</div>
</template>
<script>
import { apiPost } from "../network/request";
import { quillEditor } from "vue-quill-editor"; //调用编辑器
import "quill/dist/quill.core.css";
import "quill/dist/quill.snow.css";
import "quill/dist/quill.bubble.css";
// import $ from "jquery";
// import niceScroll from "jquery.nicescroll";
export default {
name: "Home",
components: { quillEditor },
data() {
return {
total: 0,
id: "",
//通知详情
recruitDetail: "",
fileList: [],
dialogTableVisible: false,
dialogFormVisible: false,
formLabelWidth: "120px",
//动态数据
noticeList: [],
//控制对话框的显示与隐藏
dialogVisible: false,
content: `<p></p><p><br></p><ol><li><strong><em>Or drag/paste an image here.</em></strong></li><li><strong><em>rerew</em></strong></li><li><strong><em>rtrete</em></strong></li><li><strong><em>tytrytr</em></strong></li><li><strong><em>uytu</em></strong></li></ol>`,
editorOption: {},
editorOption: {
placeholder: "请在这里输入",
modules: {
toolbar: [],
},
},
//页码
currentPage1: 5,
currentPage2: 5,
currentPage3: 5,
currentPage4: 4,
queryInfo: {
query: "",
//当前页数
pagenum: 1,
//当前每页显示多少条数据
pagesize: 2,
},
};
},
mounted() {
//公告列表数据获取
apiPost("getNoticeVouchList.do_", {
isRelease: "1",
}).then((res) => {
console.log(res);
// this.total = res.data.total;
this.noticeList = res.data.noticeList;
});
},
destroyed() {
window.removeEventListener("popstate", this.goBack, false);
},
methods: {
text(id) {
console.log(id);
},
downloadFile(filePath) {
//后台地址,生产环境需要改,最好改为配置
const basepath = "http://localhost:8080" + filePath;
const a = document.createElement("a");
a.href = basepath; //图片地址
a.download = basepath; //图片名及格式
document.body.appendChild(a);
a.click();
},
handleClose(done) {
this.$confirm("确认关闭?")
.then((_) => {
done();
})
.catch((_) => {});
},
login() {
this.$router.push({
path: "/login",
query: {},
});
},
register() {
this.$router.push({
path: "/register",
query: {},
});
},
//更多按钮
more: function () {},
showNoticeDetail(item) {
//通知详情列表
this.dialogTableVisible = true;
let res = {
recruitDetail: "",
fileList: [
],
};
this.recruitDetail = res.recruitDetail;
this.fileList = res.fileList;
console.log(item.iD);
apiPost("getNoticeById.do", { id: item.iD }).then(
(res) => {
console.log(JSON.stringify(res));
if (res.isOk == "Y") {
this.recruitDetail = res.data.recruitNotice.recruitDetail;
this.fileList = res.data.recruitNotice.fileList;
}
}
);
},
// handleSizeChange(val) {
// console.log(`每页 ${val} 条`);
// },
// handleCurrentChange(val) {
// console.log(`当前页: ${val}`);
// },
//监听pagesize改变的事件
handleSizeChange(newSize) {
this.queryInfo.pagesize = newSize;
this.noticeList();
},
//监听页码值改变的事件
handleCurrentChange(newPage) {
this.queryInfo.pagenum = newPage;
this.noticeList();
},
},
computed: {
editor() {
return this.$refs.myQuillEditor.quill;
},
},
};
</script>