Set datasource to another item with sitecore jss

Question

I am using JSS code first and want to create a component that has its datasource set to another item from which it pulls its data.

Lets say i have a 'BlogPromotionSpot' component that does not have any data itself, but wants to pull data from an actual 'BlogPost' component.

- componentName: BlogPromotionSpot
                    <No fields here so a local datasource is created>
                    <Just pull data from another blogpost item>

So basically a 'BlogPromotionSpot' does not need a template, because it always just references a 'BlogPost'

Is there any way to do this with Sitecore JSS code first ?

Answer 1

Create a seperate yml file and put the common content in the below format:

id: styleguide-item-link-field-shared-1
displayName: Styleguide Item Link Item 1 (Shared)
# Template defines the available fields. See /sitecore/definitions/templates/Styleguide-ItemLink-Template.sitecore.js
template: Styleguide-ItemLink-Item-Template
fields:
  textField: ItemLink Demo (Shared) Item 1 Text Field

Wherever you want to add the reference you can use in the below format:

sharedItemLink:
# see /data/content/Styleguide/ItemLinkField for definition of this IDs
id: styleguide-item-link-field-shared-1

You can see the same example in the Sitecore provided sample code that you got using below command:

npm install -g @sitecore-jss/sitecore-jss-cli
jss create jss-demo react

Path: jss-demo\data\content\Styleguide\ItemLinkField\Item1\en.yml

Reference:jss-demo\data\routes\styleguide\en.yml

Hoping it would help you.