ghost23 ghost23 - 1 month ago 16
React JSX Question

Understanding documentation of React with redux

I am currently reading the documentation about react and redux:

https://github.com/reactjs/redux/blob/5502940e7f139bb88bf0b67fcb838a7e3de3be6c/docs/basics/UsageWithReact.md

There, specifically in the code example here:

https://github.com/reactjs/redux/blob/5502940e7f139bb88bf0b67fcb838a7e3de3be6c/docs/basics/UsageWithReact.md#containersfilterlinkjs

you can see this line:

dispatch(setVisibilityFilter(ownProps.filter))


Now my question is, where does the 'filter' property in ownProps come from? Can somebody explain to me, where the connection is?

Answer

It is in the call to filterlink.

components/Footer.js

import React from 'react'
import FilterLink from '../containers/FilterLink'

const Footer = () => (
  <p>
    Show:
    {" "}
    <FilterLink filter="SHOW_ALL">
      All
    </FilterLink>
    {", "}
    <FilterLink filter="SHOW_ACTIVE">
      Active
    </FilterLink>
    {", "}
    <FilterLink filter="SHOW_COMPLETED">
      Completed
    </FilterLink>
  </p>
)

export default Footer