Redux - фильтр состояний - PullRequest
0 голосов
/ 13 февраля 2020

У меня есть раздел книги по покупке и раздел книги по продаже.
Я хочу показать разные записи в каждом разделе.
Когда я изменяю useFirebaseConnect , кажется, что это влияет на все состояния в приложение и я получили одинаковые результаты в каждом разделе.
Как отобразить разные результаты в каждом разделе?

SellingList / ProjectsList. js

function useProjectsList() {
  const { showSuccess, showError } = useNotifications()
  const firebase = useFirebase()

  // Get auth from redux state
  const auth = useSelector(state => state.firebase.auth)
  // Create listeners based on current users UID
  useFirebaseConnect([
    {
      path: 'projects',
      queryParams: [
        //'orderByChild=createdBy',  ****THIS CHANGE DOESN'T AFFECT BEHAVIOR****
        //`equalTo=${auth.uid}`,  ****THIS CHANGE DOESN'T AFFECT BEHAVIOR****
        'limitToLast=10'
      ]
    }
  ])

  // Get projects from redux state
  const projects = useSelector(state => state.firebase.ordered.projects)

  return { projects, addProject, newDialogOpen, toggleDialog }
}

function ProjectsList() {
  const classes = useStyles()
  const {
    projects,
    addProject,
    newDialogOpen,
    toggleDialog
  } = useProjectsList()

  // Show spinner while projects are loading
  if (!isLoaded(projects)) {
    return <LoadingSpinner />
  }

  return (
    <div className={classes.root}>
      <NewProjectDialog
        onSubmit={addProject}
        open={newDialogOpen}
        onRequestClose={toggleDialog}
      />
      <div className={classes.tiles}>
        {!isEmpty(projects) &&
          projects.map((project, ind) => {
            return (
              <SellingPostTile
                key={`Project-${project.key}-${ind}`}
                name={project && project.value.title}
                title={project && project.value.title}
                isbn={project && project.value.isbn}
                status={project && project.value.status}
                delivery_status={project && project.value.delivery_status}
                buyer_id={project && project.value.buyer_id}
                price={project && project.value.price}
                projectId={project.key}
              />
            )
          })}
        <NewProjectTile onClick={toggleDialog} />
      </div>
    </div>
  )
}

BuyingList / ProjectsList. js

function useProjectsList() {
  const { showSuccess, showError } = useNotifications()
  const firebase = useFirebase()

  // Get auth from redux state
  const auth = useSelector(state => state.firebase.auth)
  // Create listeners based on current users UID
  useFirebaseConnect([
    {
      path: 'projects',
      queryParams: [
        'orderByChild=createdBy',
        `equalTo=${auth.uid}`,
        'limitToLast=10'
      ]
    }
  ])

  // Get projects from redux state
  const projects = useSelector(state => state.firebase.ordered.projects)

  // New dialog
  const [newDialogOpen, changeDialogState] = useState(false)
  const toggleDialog = () => changeDialogState(!newDialogOpen)


  return { projects, addProject, newDialogOpen, toggleDialog }
}

function ProjectsList() {
  const classes = useStyles()
  const {
    projects,
    addProject,
    newDialogOpen,
    toggleDialog
  } = useProjectsList()

  // Show spinner while projects are loading
  if (!isLoaded(projects)) {
    return <LoadingSpinner />
  }

  return (
    <div className={classes.root}>
      <div className={classes.tiles}>
        {!isEmpty(projects) &&
          projects.map((project, ind) => {
            return (
              <BuyingPostTile
                key={`Project-${project.key}-${ind}`}
                name={project && project.value.title}
                title={project && project.value.title}
                isbn={project && project.value.isbn}
                status={project && project.value.status}
                price={project && project.value.price}
                projectId={project.key}
              />
            )
          })}
      </div>
    </div>
  )
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...