Skip to content

FeathersVuexPagination does not work with vue 3 #618

Open
@rabalyn

Description

@rabalyn

Steps to reproduce

(First please check that this issue is not already solved as described
here
)

  • Tell us what broke. The more detailed the better.

  • If you can, please create a simple example that reproduces the issue and link to a gist, jsbin, repo, etc.

  • setup vue 3 and feathers-vuex

  • use feathers-vuex-pagination

Expected behavior

Pagination data should be accessible and usable inside of FeathersVuexPagination

Actual behavior

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading '$limit')
  at ReactiveEffect.eval [as fn] (FeathersVuexPagination.js?4af6:36)
  at ReactiveEffect.run (reactivity.esm-bundler.js?0a2b:160)
  at ComputedRefImpl.get value [as value] (reactivity.esm-bundler.js?0a2b:1087)
  at lq (FeathersVuexPagination.js?4af6:72)
  at callWithErrorHandling (runtime-core.esm-bundler.js?9e79:6987)
  at ReactiveEffect.getter [as fn] (runtime-core.esm-bundler.js?9e79:7332)
  at ReactiveEffect.run (reactivity.esm-bundler.js?0a2b:160)
  at Array.job (runtime-core.esm-bundler.js?9e79:7368)
  at flushPreFlushCbs (runtime-core.esm-bundler.js?9e79:7160)
  at updateComponentPreRender (runtime-core.esm-bundler.js?9e79:4664)

The error is referencing this in FeathersVuexPagination.js:

const pageCount = computed(() => {
    const q = props.latestQuery;
    if (q && q.response) {
        return Math.ceil(q.response.total / props.value.$limit); // error thrown here
    }
    else {
        return 1;
    }
});

There is no props.value, it was completely replaced by props.modelValue.

System configuration

Tell us about the applicable parts of your setup.

Module versions (especially the part that's not working):

"dependencies": {
    "@feathersjs/authentication-client": "^4.5.11",
    "@feathersjs/feathers": "^4.5.11",
    "@feathersjs/socketio-client": "^4.5.11",
    "@feathersjs/vuex": "^4.0.1-pre.16",
    "@quasar/app": "^3.1.10",
    "@quasar/extras": "^1.11.5",
    "core-js": "^3.19.1",
    "feathers-hooks-common": "^5.0.6",
    "quasar": "^2.3.0",
    "socket.io-client": "^2.4.0",
    "vuex": "^4.0.1"
  }

NodeJS version:
v16.13.1

Operating System:
Ubuntu 20.04

Browser Version:
Chrome 97

React Native Version:
N/A

Module Loader:
Webpack 5 / quasar 2

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions