时间戳

首页 > 解决方案 > 从最喜欢到最不喜欢对我的旅行进行排序

javascript - 从最喜欢到最不喜欢对我的旅行进行排序

问题描述

我无法成功地将我的旅行从最多喜欢的次数排序到最少的喜欢次数。我想使用排序（）。我开始尝试将道具从商店传递到 myTrip 组件。我目前在 mytrips 中拥有的是我使用地图来列出我目前拥有的所有旅行。这是一个反应 redux 应用程序。这是我的代码。


 

  import React from 'react'
import { connect } from 'react-redux'
import  TripCard from './TripCard.js'

const MyTrips = props => {
  const tripCards = props.trips.length > 0 ?
      props.trips.map(t => <TripCard trip={t} key={t.id}/>) : null
    

      

  return (
      
      tripcards


  )
}

const mapStateToProps = state => {
  return {
    trips: state.myTrips,
    likes: state.mytrips
    
  }
}

export default connect(mapStateToProps)(MyTrips)


**MyTrips Reducer**

const initialState = []

export default (state = initialState, action) => {
switch (action.type) {
  case "SET_MY_TRIPS":
    return action.trips
  case "ADD_TRIP":
    return state.concat(action.trip)
  case "UPDATE_TRIP":
    return state.map(trip => trip.id === action.trip.id ? action.trip : trip)
  case "DELETE_TRIP":
    return state.filter(trip => trip.id === action.tripId ? false : true)
  case "CLEAR_TRIPS":
    return initialState
  default:
    return state
}
}

**AddTripLike Action**

  export const addTripLike = (tripData,history) => {
return dispatch => {
const sendableTripData = {
  likes: tripData.likes
}

return fetch(`http://localhost:3001/api/v1/trips/${tripData.tripId}/add_likes`, {
  credentials: "include",
  method: "PATCH",
  headers: {
    "Content-Type": "application/json"
  },
  body: JSON.stringify(sendableTripData)
})
.then(response => response.json())
.then(resp => {
  if (resp.error) {
    alert(resp.error)
  } else {
    //window.location.reload();
    console.log(resp.data)
    dispatch(updateTripSuccess(resp.data))
    history.push(`/trips/${resp.data.id}`)

  }
})
.catch(console.log)  
}
}

标签： javascriptreactjsreact-redux

解决方案

在您的情况下，它看起来像这样：

trips.sort((a, b) => {
  b.likes - a.likes
}

为了让您快速了解它的工作原理：

当你使用 (b - a) 时，它要么

  1. 返回一个大于 0 的值，该值被解释为 true。
  2. 返回一个零值，该值将被解释为假。
  3. 得到一个负值，它也被解释为假。

这样，所有值都将按降序排序。如果您想了解更多信息，请查看排序文档。

另一个有用的概述：

https://www.javascripttutorial.net/array/javascript-sort-an-array-of-objects/

推荐阅读