2016-09-22 13 views
0

私はReactを使用してレストラン違反アプリを作成しています。検索された項目がデータセットの部分文字列である場合に結果を返そうとしています。しかし、エラーメッセージが表示されます。JS文字列内の部分文字列IndexOf()を見つける

ViolationsRequest.jsx:49 Uncaught TypeError: Cannot read property 'indexOf' of null.

私のテストに基づいて、door.restaurantがコンソールに未定義として記録されているようです。理想的には、このコードは完全一致として機能します。つまり、ifブロックを次のように切り替えると、

これは私のコードブロックです。

const violationElements = this.state.doors.map((door, idx) => { 
     if (door.restaurant.indexOf(this.props.restaurant) !== -1) { 
     console.log(); 
     return (
      <ViolationsView key={idx} 
         restaurant={door.restaurant} 
         building={door.building} 
         street={door.street} 
         zip={door.zip} 
         phone={door.phone} 
         cuisine={door.cuisine} 
         inspectionDate={door.inspectionDate} 
         action={door.action} 
         violationCode={door.violationCode} 
         violationDescription={door.violationDescription} 
         criticalFlag={door.criticalFlag} 
         score={door.score} 
         grade={door.grade} 
         gradeDate={door.gradeDate} 
         inspectionType={door.inspectionType} 
      /> 
     ) 
     } 
    }); 

これは私のstate.doors配列です:

const cleanData = restaurantData.data.map((inspectionData) => { 
    const [sid, id, position, createdAt, createdMeta, 
     updatedAt, updatedMeta, meta, camis, dba, boro, 
     building, street, zipcode, phone, cuisine, 
     inspectionDate, action, violationCode, 
     violationDescription, criticalFlag, score, grade, 
     gradeDate, recordDate, inspectionType] = inspectionData; 
    return { 
     sid: sid, 
     restaurant: dba, 
     building: building, 
     street: street, 
     zip: zipcode, 
     phone: phone, 
     cuisine: cuisine, 
     inspectionDate: inspectionDate, 
     action: action, 
     violationCode: violationCode, 
     violationDescription: violationDescription, 
     criticalFlag: criticalFlag, 
     score: score, 
     grade: grade, 
     gradeDate: gradeDate, 
     inspectionType: inspectionType, 
    }; 
    }); 
+0

state.doorsアレイの外観を教えてください。ドアのオブジェクトのプロパティと値も含まれます。あなたの '' if(this.props.restaurant!== door.restaurant) 'は働いていないので、door.restaurantのプロパティにアクセスしようとしていないため、動作しません。 – finalfreq

+0

JSXのスプレッド演算子を使用することについては、あなたのJSXがなるにつれてこれを読みやすくするでしょう。

+1

* "不思議なことに、このコードは完全に一致します" *まあ、未定義のプロパティにアクセスすることは問題ではありません。 'undefined'にあるプロパティにアクセスしようとしています。 'foo.bar'と' foo.bar.baz'には大きな違いがあります。 * "それはドアのように見えます。レストランは未定義のままコンソールに記録されています" *はい、そういう意味でもエラーが表示されます。あなたは問題が何であるかを知っているようです。あなたは私たちに何を望みますか? –

答えて

0

一つであることはどのようなエラーメッセージが表示状態である、nullです。 Null、未定義ではありません。それが定義されていない場合、エラーメッセージはそう言いました。この値でdoors.restaurant.indexOfを呼び出すと、エラーが返されます。

これをタイプすると、あなたはすでにそれを理解したようです。

0

私はこの問題は==あなたが検証している唯一の値は入力しないであなたは、===演算子を使用していないと思い。 例:

var foo = null; 
 
var bar = ''; 
 
var baz = 0; 
 
var off = {}; 
 

 
console.log(bar == baz); // true 
 
console.log(bar === baz); // false 
 
console.log(foo == off.bar); // true 
 
console.log(foo === off.bar); // false

ので、おそらくthis.props.restaurant == door.restaurantが真 しかしthis.props.restaurant === door.restaurantですが、あなたのdoors.restaurantの偽

関連する問題