如何通过jsog在spring Boot /react中生成一个对象而不仅仅是一个引用?

qv7cva1a  于 2022-12-13  发布在  Spring
关注(0)|答案(1)|浏览(127)

我是jsog新手,但我知道它可以帮助从后端到前端生成数组对象。如果数组i得到这样的引用,而不是第一个元素后的对象,
0:{@识别码:'1',识别码:1,取值:'卡尔加里',地区:{...},街坊:数组(1),...} 1:{@参考:'4'}
我应该怎么做才能从数组中得到所有的对象而不仅仅是第一个元素?
React了

class Neighborhood extends Component {
  
    
    //to load data upon generation.
   constructor(props){  
      super(props);  
      this.state = {  
         neighborhoodError: ''  ,cityList:[],cityFilterList:[],
       neighborhood:{value:"",city:""},neighborhoodNames:[""], list:[],
       action:"",
       filterList:[],
       currentValue:"",currentValuecity:"",
       tags:"",
       isInvisible:true
        }
        this.handleSubmit = this.handleSubmit.bind(this);
        this.filterList=this.filterList.bind(this);
        this.onChange = this.onChange.bind(this);
        this.onChangeCity = this.onChangeCity.bind(this);
        this.onClick = this.onClick.bind(this);
        this.removeItem = this.removeItem.bind(this);
      } 
       //to filter list
      filterList(event,type){
        if(type==='city'){
          let newlist=[];
          this.state.cityList.map((e)=>{
            if(e.value.startsWith(event)){
               newlist.push(e.value+","+e.region.value+","+e.region.country.value);
            }
          
          }); 

         
         this.setState({ cityFilterList:newlist }, () => {
          console.log(this.state.cityFilterList);
         });
         console.log(this.state.cityFilterList);
         console.log(newlist);
          this.setState({currentValuecity:event});


         
          
        }
        else{
          let newlist=[];
          this.state.list.map((e)=>{
            if(e.value.startsWith(this.state.currentValue)&&this.state.currentValue!==''){
              newlist.push(e.value+","+e.city.value+","+e.city.region.value+","+e.city.region.country.value);
            }
           
          }); 
          this.setState({filterList:newlist}); 
          console.log(this.state.filterList);
            this.setState({currentValue:event});
        }
  
}
//when a tag in a dropbox is clicked current value is the tags value
onClick(id){
  let newValue=this.state.filterList[id];
  this.setState({currentValue:newValue});
  this.setState({isInvisible:true});
}
//to generate tags

//upon input change.
onChange(event){
 

  this.filterList(event,'neighborhood');
}
onChangeCity(event){
 
  this.filterList(event,'city');
}

         //to remove item upon request.
     removeItem(){
      let path='/neighborhood';
      axios.delete(
        'http://localhost:8080/neighborhood/'+this.props.id);
      window.location.reload(false);
     }
      
      async  componentDidMount() {
        
        let ofList=[];
            await axios.get(
              'http://localhost:8080/neighborhood')
                 .then(res => {
                   let newList=[]
                   newList=res.data;
                   newList.map(
                    (e)=>{
                      ofList.push({id:e.id,value:e.value,city:e.city});
                    }
                   );
               }).then().catch(
               function (error) {
                console.log(error);
              });
              this.setState({list:ofList});
        

          let fromList=[];
          axios.get(
            'http://localhost:8080/'+"city")
               .then(res => {
                 let newList=res.data;
                 newList.map(
                  (e)=>{
                    fromList.push({id:e.id,value:e.value,region:e.region});
                  }
                 );
             }).then().catch(
             function (error) {
              console.log(error);
            });
            this.setState({cityList:fromList});

        if(this.props.id!==-1){
        axios.get(
          'http://localhost:8080/neighborhood/'+this.props.id)
             .then(res => {
                this.setState({neighborhood: res.data});
           }).catch(
           function (error) {
            console.log(error);
          });}
          else{

           
            let emptyItem={
              value:"",city:this.props.city
            }
            this.setState({neighborhood:emptyItem});
          }
          console.log(this.state.neighborhood);
      } 
      //upon entering the input button edit or save will be completed.
      async handleSubmit(event) {
         event.preventDefault();

         let supraList=this.state.cityList;
         let newNeighborhood=this.state.neighborhood;
         for(let i=0;i<supraList.length;i++){
          let values=this.state.currentValuecity.split(',');
          if(supraList[i].value===this.state.currentValuecity.split(',')[0]&&supraList[i].region.value===this.state.currentValuecity.split(',')[1]&&supraList[i].region.country.value===this.state.currentValuecity.split(',')[2]){
            newNeighborhood.city=supraList[i];
          }
         }
          newNeighborhood.value=this.state.currentValue;
          this.setState({neighborhood:newNeighborhood});

        
         await axios.post(
          'http://localhost:8080/neighborhood',this.state.neighborhood)
             .then(res => {
                this.setState({neighborhoodError: res.data});
           }).catch(
           function (error) {
            console.log(error);
          });
     }
    render()
    {
   
if(this.state.neighborhood.city===null){
  return( <div>

    <div> city: <Autocomplete list={this.state.cityFilterList} onChangeValue={this.onChangeCity}/></div>
 <form  onSubmit={this.handleSubmit} >
 <div><b>previous value:{this.state.neighborhood.value || ''}</b></div>
    <label>neighborhood:</label>
    <Autocomplete list={this.state.filterList} onChangeValue={this.onChange}/>
    <div>{this.state.neighborhoodError}</div>
    <input type="submit" value="Submit"></input>
 </form>
 <button onClick={this.removeItem}>
    Delete
  </button>
</div>);
}

           return( <div>

                                          <div> city: {this.state.neighborhood.city.name || ''}</div>
                                       <form  onSubmit={this.handleSubmit} >
                                       <div><b>previous value:{this.state.neighborhood.value || ''}</b></div>
                                          <label>neighborhood:</label>
                                          <Autocomplete list={this.state.filterList} onChangeValue={this.onChange}/>
                                          <div>{this.state.neighborhoodError}</div>
                                          <input type="submit" value="Submit"></input>
                                       </form>
                                       <button onClick={this.removeItem}>
                                          Delete
                                        </button>
                                </div>);


  }
}

// Exporting the component
export default Neighborhood;

我的春靴课

@JsonInclude(JsonInclude.Include.NON_NULL)
@JsonIdentityInfo(scope = Neighborhood.class,
        generator = ObjectIdGenerators.PropertyGenerator.class,
        property = "id")
@Getter
@Setter
@Builder
@AllArgsConstructor
@NoArgsConstructor
@Entity
@Table(name = "neighborhood ")
public class Neighborhood   implements Serializable {

    private static final long serialVersionUID = 1L;
    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private Long id;
    @Column(name = "value", nullable = false)
    private String value;

    //here idiot

    @OneToMany(fetch=FetchType.LAZY, mappedBy="neighborhood")
    private Set<Transaction> transactions;
    //here idiot
    @ManyToOne(fetch = FetchType.LAZY, optional = false)
    @JoinColumn(name = "city_id")
    private City city;
    @OneToMany(fetch=FetchType.LAZY, mappedBy="employee")
    private Set<EmployeeGeographicData> employeeGeographicDataSet;
}

@JsonInclude(JsonInclude.Include.NON_NULL)
@JsonIdentityInfo(generator= JSOGGenerator.class)
@Getter
@Setter
@Builder
@AllArgsConstructor
@NoArgsConstructor
@Entity
@Table(name = "city")
public class City  implements Serializable{

    private static final long serialVersionUID = 1L;
    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private Long id;

    @Column(name = "value", nullable = false)
    private String value;

    @ManyToOne(fetch = FetchType.LAZY, optional = false)
    @JoinColumn(name = "region_id")
    private Region region;

    @OneToMany(fetch=FetchType.LAZY, mappedBy="city")
    private Set<Neighborhood> neighborhoods;
    @OneToMany(fetch=FetchType.LAZY, mappedBy="employee")
    private Set<EmployeeGeographicData> employeeGeographicDataSet;
}
px9o7tmv

px9o7tmv1#

let newList=res.data;
                 let newObject={};
                 let target="";
                target = JSOG.stringify(res.data);
                 newObject= JSOG.parse(target);

相关问题