প্রতিক্রিয়া হিসাবে রাষ্ট্র অ্যারে থেকে আইটেম মুছুন

Question

গল্পটি হ'ল, আমার উচিত বব, স্যালি এবং জ্যাককে একটি বাক্সে রাখতে। আমি বাক্স থেকে হয় অপসারণ করতে পারেন। সরানো হলে, কোনও স্লট বাকি নেই is

people = ["Bob", "Sally", "Jack"]

আমার এখন অপসারণ করতে হবে, বলুন, "বব"। নতুন অ্যারেটি হ'ল:

["Sally", "Jack"]

এখানে আমার প্রতিক্রিয়া উপাদান:

...

getInitialState: function() {
  return{
    people: [],
  }
},

selectPeople(e){
  this.setState({people: this.state.people.concat([e.target.value])})
},

removePeople(e){
  var array = this.state.people;
  var index = array.indexOf(e.target.value); // Let's say it's Bob.
  delete array[index];
},

...

এখানে আমি আপনাকে একটি ন্যূনতম কোড দেখাব কারণ এতে আরও রয়েছে (অনক্লিক ইত্যাদি)। মূল অংশটি হ'ল অ্যারে থেকে "বব" মুছে ফেলা, মুছে ফেলা, ধ্বংস করা কিন্তু removePeople()যখন ডাকা হয় তখন কাজ করে না। কোন ধারনা? আমি এটি তাকিয়ে ছিলাম আমি যেহেতু প্রতিক্রিয়া ব্যবহার করছি তখন থেকে আমি কিছু ভুল করছি।

Answer 1

একটি অ্যারের থেকে উপাদান সরানোর জন্য, কেবল এটি করুন:

array.splice(index, 1);

তোমার ক্ষেত্রে:

removePeople(e) {
  var array = [...this.state.people]; // make a separate copy of the array
  var index = array.indexOf(e.target.value)
  if (index !== -1) {
    array.splice(index, 1);
    this.setState({people: array});
  }
},

Comments

আমার ক্ষেত্রে এটি ছিল: array.splice(array, 1);ধন্যবাদ

— সিলার

array.splice(array, 1);? আমার ধারণা আপনি এটি সম্পাদনা করতে হবে..আপনি বিভিন্ন ভেরিয়েবল ব্যবহার করা উচিত ...

— রেয়ন

প্রতিক্রিয়া ব্যবহার করার সময়, আপনার সাধারণত আপনার রাষ্ট্রকে সরাসরি পরিবর্তন করা এড়ানো উচিত। আপনার একটি নতুন অ্যারে তৈরি করা উচিত setState()।

— iaretiga

আমি এই ক্ষেত্রে স্প্রেড অপারেটরের পরিবর্তে অ্যারে.ফ্রোম (this.state.items) ব্যবহার করার পরামর্শ দিচ্ছি। এর কারণ অ্যারে.ফ্রোম বিশেষত এই ব্যবহারের জন্য তৈরি intended

— ফ্রান্সিসকো হজ

ছোট পরামর্শ, অযাচিত অপসারণগুলি রোধ করতে অ্যারে ছড়িয়ে দেওয়ার আগে "সূচক! == -1" এর জন্য একটি চেক যুক্ত করুন।

— রোববার

Answer 2

প্রতিক্রিয়া ব্যবহার করার সময়, আপনার কখনই রাষ্ট্রকে সরাসরি রূপান্তর করা উচিত নয়। যদি কোনও বস্তু (বা Array, যা একটি বস্তুও) পরিবর্তন করা হয় তবে আপনার একটি নতুন অনুলিপি তৈরি করা উচিত।

অন্যরা ব্যবহারের পরামর্শ দিয়েছেন Array.prototype.splice(), কিন্তু সেই পদ্ধতিটি অ্যারেটিকে পরিবর্তিত করে, তাই splice()প্রতিক্রিয়াটি ব্যবহার না করাই ভাল ।

Array.prototype.filter()একটি নতুন অ্যারে তৈরি করতে ব্যবহার করা সবচেয়ে সহজ :

removePeople(e) {
    this.setState({people: this.state.people.filter(function(person) { 
        return person !== e.target.value 
    })});
}

Comments

হ্যাঁ এটি ঘোষিত উপায়। প্রিস্টেট এবং তীর ফাংশন ব্যবহার করে একটি বিকল্প পদ্ধতি:this.setState(prevState => ({ people: prevState.people.filter(person => person !== e.target.value) }));

— জোশ মোরেল

কখনও রূপান্তরকারী রাষ্ট্রের প্রতিক্রিয়া প্রতিমা হিসাবে এটি স্বীকৃত উত্তর হওয়া উচিত।

— লাক্স

বা সূচি ব্যবহার করে:this.state.people.filter((_, i) => i !== index)

— এমবি 21

এমন টুকরো রয়েছে যা অপরিবর্তনীয় এবং বিভাজক যে বিভাজক

— ক্যাসিয়ান

এই উত্তরের সাথে ইস্যু করা হ'ল যদি আপনার একই নামের একাধিক ব্যক্তি থাকে তবে আপনি এই সমস্তগুলি মুছে ফেলবেন। সূচকটি ব্যবহার করা সেই ক্ষেত্রে নিরাপদ যেখানে আপনার দ্বিধা থাকতে পারে

— ক্লুগো

Answer 3

ES6 ব্যবহার করে আলেকসান্দ্র পেট্রোভের প্রতিক্রিয়া সম্পর্কে এখানে একটি সামান্যতম পার্থক্য

removePeople(e) {
    let filteredArray = this.state.people.filter(item => item !== e.target.value)
    this.setState({people: filteredArray});
}

Answer 4

.spliceঅ্যারে থেকে আইটেম সরানোর জন্য ব্যবহার করুন । ব্যবহার করে delete, অ্যারের সূচকগুলি পরিবর্তিত হবে না তবে নির্দিষ্ট সূচকের মান হবেundefined

সংযুক্ত করান () পদ্ধতি বিদ্যমান উপাদান সরানোর এবং / অথবা নতুন উপাদান যোগ করে একটি অ্যারের বিষয়বস্তু পরিবর্তন।

বাক্য গঠন: array.splice(start, deleteCount[, item1[, item2[, ...]]])

var people = ["Bob", "Sally", "Jack"]
var toRemove = 'Bob';
var index = people.indexOf(toRemove);
if (index > -1) { //Make sure item is present in the array, without if condition, -n indexes will be considered from the end of the array.
  people.splice(index, 1);
}
console.log(people);

সম্পাদনা:

জাস্টিন-অনুদান দ্বারা নির্দেশিত হিসাবে, থাম্বের একটি নিয়ম হিসাবে কখনও কখনওthis.state সরাসরি রূপান্তর করবেন না, কারণ setState()পরবর্তী সময়ে কল করা আপনার করা রূপান্তর প্রতিস্থাপন করতে পারে। এমন আচরণ করুন this.stateযেন তা স্থাবর হয়।

বিকল্প বস্তু কপি তৈরি করা হয় this.stateএবং কপি নিপূণভাবে তাদের বরাদ্দ ফিরে ব্যবহার setState()। Array#map, Array#filterইত্যাদি ব্যবহার করা যেতে পারে।

this.setState({people: this.state.people.filter(item => item !== e.target.value);});

Comments

স্প্লাইস বা এমন কোনও পদ্ধতি ব্যবহার না করে তা নিশ্চিত করুন যা সরাসরি আপনার রাজ্যের পরিবর্তনশীল পরিবর্তন করে। পরিবর্তে, আপনি অ্যারের একটি অনুলিপি তৈরি করতে চান, অনুলিপিটি থেকে আইটেমটি সরিয়ে, এবং তারপরে অনুলিপিটি পাস করতে চান setState। অন্যান্য উত্তরগুলিতে এটি কীভাবে করা যায় সে সম্পর্কে বিশদ রয়েছে।

— জাস্টিন গ্রান্ট

Answer 5

প্রতিক্রিয়া হিসাবে স্টেট অ্যারে থেকে আইটেম মোছার সহজ উপায়:

যখন কোনও ডেটা ডাটাবেস এবং আপডেট তালিকা থেকে মুছে ফেলা হয় যখন এপিআই কল না করে আপনি এই ফাংশনে মুছে ফেলা আইডি পাস করেন এবং এই ফাংশনটি তালিকা থেকে পুনরুদ্ধার করা মুছে ফেলা হবে

export default class PostList extends Component {
  this.state = {
      postList: [
        {
          id: 1,
          name: 'All Items',
        }, {
          id: 2,
          name: 'In Stock Items',
        }
      ],
    }


    remove_post_on_list = (deletePostId) => {
        this.setState({
          postList: this.state.postList.filter(item => item.post_id != deletePostId)
        })
      }
  
}

Comments

এই তিন বছরের পুরানো প্রশ্নের 8 টি উত্তর থেকে কীভাবে এটি আলাদা হয় আপনি ব্যাখ্যা করতে পারেন? পর্যালোচনা থেকে

— ওয়াই হা লি

উপরের কোড এটা ডেটার নতুন অ্যারে পুনঃ কিন্তু "deletePostId" এই আইডি এড়িয়ে যাবে

— অঙ্কিত-DETROJA

ব্যবহারitem.post_id !== deletePostId

— নিমিশ গোয়েল

Answer 6

কিছু উত্তর 'স্প্লাইস' ব্যবহার করে উল্লিখিত হয়েছে, যা চান্স স্মিথ বলেছিল অ্যারেটিকে রূপান্তরিত করেছিল। আমি আপনাকে মেথড কলটি 'স্লাইস' ('স্লাইস'-এর জন্য নথি এখানে) ব্যবহার করার পরামর্শ দিচ্ছি যা মূল অ্যারের অনুলিপি তৈরি করে।

Answer 7

এটি খুব সহজ প্রথম আপনি একটি মান নির্ধারণ করুন

state = {
  checked_Array: []
}

এখন,

fun(index) {
  var checked = this.state.checked_Array;
  var values = checked.indexOf(index)
  checked.splice(values, 1);
  this.setState({checked_Array: checked});
  console.log(this.state.checked_Array)
}

Answer 8

আপনি ব্যবহার করতে ভুলে গেছেন setState। উদাহরণ:

removePeople(e){
  var array = this.state.people;
  var index = array.indexOf(e.target.value); // Let's say it's Bob.
  delete array[index];
  this.setState({
    people: array
  })
},

তবে এটি ব্যবহার করা ভাল filterকারণ এটি অ্যারেটি পরিবর্তন করে না। উদাহরণ:

removePeople(e){
  var array = this.state.people.filter(function(item) {
    return item !== e.target.value
  });
  this.setState({
    people: array
  })
},

Answer 9

removePeople(e){
    var array = this.state.people;
    var index = array.indexOf(e.target.value); // Let's say it's Bob.
    array.splice(index,1);
}

আরও তথ্যের জন্য ডক পুনরায় রেফার করুন