0

情况

根据 element-plus.org 的文档:https ://element-plus.org/#/en-US/component/pagination 您应该能够为分页组件设置当前页面。

我的页面/组件可以工作,除非我以新的页面加载进入页面,我希望组件接管转换为反应变量“currentPage”的参数“page”并使用它将当前页面设置为突出显示在组件中。

问题

然而,即使属性被设置为 3,组件仍然显示第 1 页。 currentPage 是完全反应式的,并且在其上方的 mustache 中解析时会显示。

文档不一致?

我尝试了不同的东西,但他们自己的文档也不一致,或者我很笨。

在“更多元素”示例中显示v-model:currentPage="currentPage1",但在“属性”部分中显示::current-page:default-current-page. 两者都不起作用。

我的代码[模板]:

  {{ currentPage }} <!-- this actually shows the page I am currently on from param -->
  <el-pagination
    @current-change="paginate"
    :currentPage="currentPage"
    :current-page="currentPage"
    :default-current-page="currentPage"
    :total="data.length"
    :page-size="limit"
    :pager-count="6"
    layout="prev, pager, next"
  >
  </el-pagination> <!-- evil component only highlights (default) 1 -->

中的相关部分setup()

    const currentPage = ref();
    watch(props, () => {
      currentPage.value = router.currentRoute.value.params.page || 1;
      initOutputVal();
    });
    // pagination
    const paginate = (e) => {
      router.push({ params: { page: e } });
    };
    const initOutputVal = () => {
      let startSlice = (currentPage.value - 1) * props.limit;
      output.value = props.limit ? props.data.slice(startSlice, startSlice + props.limit) : props.data;
    };

有谁知道我做错了什么?element-plus 不测试他们的东西还是我在这里无知?最好的解决方案是什么?

4

1 回答 1

0

问题已经解决了。一位同事指出该值并不是真正的整数。如果parseInt()您像我一样从 url 获取值,请使用。就我而言:

currentPage.value = parseInt(router.currentRoute.value.params.page) || 1;
于 2021-09-07T08:25:41.780 回答