How can I send more parameters in the edit rendering of a Resource component? - react-admin

When I set a component as the edit prop for a resource, react-admin renders that component when users go to the /[resource]/:id URL.
But I would like to send more data as a parameter, for example make the request using a client_code and not the id.

Related

How to create dynamic route in Nuxt?

By default, nuxt adds a route for each page in pages.
I want to make when going to the page e.g. project.local/id/ec29cjsa5fas512ik, the user goes to a page template and the Vue receives this ec29cjsa5fas512ik id from the url so it can make proper API calls later.
You can make a dynamic page in Nuxt2 with the following file, eg.
/pages/details/_id.vue
then you'll have a path like /details/:id.
More info can be found here: https://nuxtjs.org/docs/features/file-system-routing#dynamic-routes

Binding Vue v-model with initial data coming from server side

I am new to Vue and I am trying to understand some concepts. So I have a website that is a mix of server-side and front-end rendering. When the index is first loaded it will return the first 10 products which are rendered by the server-side. Then the user will use a search filter to search for specific products or just scroll down so more products are loaded. This searching and loading will be done by Vue. Now the question is how to bind the data that is rendered initially by the server with the current data object of Vue?
The documentation says
v-model will ignore the initial value, checked or selected attributes
found on any form elements. It will always treat the current active
instance data as the source of truth. You should declare the initial
value on the JavaScript side, inside the data option of your
component.
So one can load the index without any data, then fire a second request to load the initial data but why waste one HTTP request on that?

SAP Spartacus Create login popup

I neet to create registration/login popup.
The header component is on all pages.
I have login btn in header.
I have page /login/register with a slot BodyContentSlot-register
I don’t know how many components can be added to BodyContentSlot-register, but I need to click on the icon in the header to show the registration form in a modal window without going to the registration page. And show in a modal window all the components of this slot.
To achieve directly what you've described:
In the modal:
you need to make a call using CMS service to get page data (that calls backend for CMS page data) OR get the data if you've loaded it before (as an optimizaiton only)
display the slot's content you want to show, i.e. using cx-page-slot component statically in your modal and passing the position as an input
The tricky part is that this component gets from CmsService the slots of the current page, i.e. cart page (based on routing /cart), but not the page data you've loaded programatically in your modal. So you need to customize CmsService to return you the CMS data for specific slot of given page (register), even if it's not a part of current page data.

Creating a URL & setting Vue.js Vuex state from its parameters

I have a SPA built in Vue.js that lets the user input several values to create something like a recipe. All these values are stored in Vuex state. I would like to be able to create a URL using the state values that the user entered so that another user can load the app with those values already entered. Essentially I want to allow users to share the recipes they created in my app by sharing a URL.
I'm imagining a "share" button which will copy the created URL to the user's clipboard which they can then post on social media or whatever. Then when someone visits the link, they will go to my app and the vuex state values will automatically be updated to the parameter values found in the URL.
What is the best way to achieve this functionality? Is this something that is possible with vue-router?
Use the $route.query property provided by vue-router.
Pass in a parameters through your URL like http://example.com/#/?amount=10 and access them with this.$route.query.amount.
Update your vuex store in the main component's mounted() method.
Official Documentation for the Route object
If I understand you correctly the vue-router should do exactly that.
have a look at the documentation where they send the user id. You can pass as many parameters as you like.
https://router.vuejs.org/en/essentials/dynamic-matching.html
note: you may consider rebuilding application paths using the router.

Sitecore Web API GetRenderingHtml response message

I have a requirement of getting HTML output for a component in a page.
I get a response message "Preview is unavailable for the Default rendering." when I try to use GetRenderingHTML Web API.
My API call looks like : http://<HostName>/-/item/v1/-/actions/GetRenderingHtml?database=master&language=en-US&renderingId=<RENDERING_ID>&itemId=<ITEM_ID>
There are couple things you need to consider while using GetRenderingHtml action.
GetRenderingHtml does not return output of a component on a page. The itemId parameter is used to find a datasource for your component, not a page which uses a component.
It only allows method redering, sublayout, url rendering, xsl rendering, webcontrol and xmlcontrol to be rendered.
The fact that your message says for the Default rendering means that whatever id you passed as renderingId, there is an item in your database with this id and DisplayName property set to Default and this item is not a rendering listed in point 2.