Skip to content

[FIX] rpc: fix code examples for tutorial and service #13151

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 1 commit into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 5 additions & 8 deletions content/developer/reference/frontend/services.rst
Original file line number Diff line number Diff line change
Expand Up @@ -95,15 +95,13 @@ component later. For example:

.. code-block:: javascript

import { useService } from "@web/core/utils/hooks";
import { rpc } from "@web/core/network/rpc";

class MyComponent extends Component {
setup() {
const rpc = useService("rpc");

onWillStart(async () => {
this.someValue = await rpc(...);
});
const result = await rpc(...);
})
}
}

Expand Down Expand Up @@ -623,11 +621,10 @@ argument and optionally, a ``params`` object can be given as a second argument.

.. code-block:: javascript

// in setup
this.rpc = useService("rpc");
import { rpc } from "@web/core/network/rpc";

// somewhere else, in an async function:
const result = await this.rpc("/my/route", { some: "value" });
const result = await rpc("/my/route", { some: "value" });

.. note::

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -199,22 +199,23 @@ Let's improve the dashboard by adding a few dashboard items to display *real* bu
The `awesome_dashboard` addon provides a `/awesome_dashboard/statistics` route that is meant
to return some interesting information.

To call a specific controller, we need to use the :ref:`rpc service <frontend/services/rpc>`.
To call a specific controller, we need to use the :ref:`rpc <frontend/services/rpc>` function.
It only exports a single function that perform the request: :code:`rpc(route, params, settings)`.
A basic request could look like this:

.. code-block:: js

import { rpc } from "@web/core/network/rpc";
// ...

setup() {
this.rpc = useService("rpc");
onWillStart(async () => {
const result = await this.rpc("/my/controller", {a: 1, b: 2});
// ...
});
onWillStart(async () => {
const result = await rpc("/my/controller", {a: 1, b: 2});
})
// ...
}

#. Update `Dashboard` so that it uses the `rpc` service.
#. Call the statistics route `/awesome_dashboard/statistics` in the `onWillStart` hook.
#. Update `Dashboard` so that it uses the `rpc` function and call the statistics route `/awesome_dashboard/statistics`.
#. Display a few cards in the dashboard containing:

- Number of new orders this month
Expand All @@ -227,7 +228,7 @@ A basic request could look like this:
:align: center

.. seealso::
`Code: rpc service <{GITHUB_PATH}/addons/web/static/src/core/network/rpc_service.js>`_
`Code: rpc <{GITHUB_PATH}/addons/web/static/src/core/network/rpc.js>`_

5. Cache network calls, create a service
========================================
Expand Down