2016-07-30 5 views
3

나는 하지 않았다 할일 I ...을 참조 "라인 (22)에 예기치 않은 토큰"오류 메시지가 무엇입니까 https://github.com/tayiorbeii/egghead.io_redux_course_notes/blob/master/08-Reducer_Composition_with_Arrays.md반작용-REDUX 확산 연산자를 감속기에 오류 "예기치 않은 토큰"을 반환

에서 단 아브라모프의 코드를 따라 그것은 바벨 사전 설정과 관련이 있다고 생각합니다 ... 주정부는 잘 작동합니다. map 함수 내에서 ... todo ... state로 대체하면 같은 오류를 반환합니다.

///Reducer// 
    export default (state=[], action) => { 
     switch (action.type) { 

     case 'ADD_TODO': 
      return [...state, 
       { 
       id:action.id, 
       text: action.text, 
       completed:false 
       } 
      ]; 

     case 'TOGGLE_TODO': 
      return state.map(todo => { 
      if (todo.id !== action.id) { 
       return todo; 
      } 

      return { 
       ...todo, //returning error 
       completed: !todo.completed 
      }; 
      }); 


     default: 
      return state; 
     } 
    } 

내 호출 코드 :

it('handles TOGGLE_TODO',() => { 
    const initialState = [ 
     { 
     id:0, 
     text: 'Learn Redux', 
     completed: false 
     }, 
     { 
     id:1, 
     text: 'Go Shopping', 
     completed: false 
     } 
    ]; 


    const action = { 
     type: 'TOGGLE_TODO', 
     id: 1 
    } 




    const nextstate = reducer(initialState,action) 



    expect (nextstate).to.eql([ 
     { 
     id:0, 
     text: 'Learn Redux', 
     completed: false 
     }, 
     { 
     id:1, 
     text: 'Go Shopping', 
     completed: true 
     } 
    ]) 
+0

확산 연산자가 작동하는 이유 인 배열과 객체에 대해 다르게 정의로 그것을 desugar ... 상태가 아닌 ... todos. 어디서나 .babelrc 파일을 가지고 있습니까? 객체 스프레드 연산자를 사용하려면 적어도 2 단계가 필요합니다. https://github.com/sebmarkbage/ecmascript-rest-spread –

+0

.babelrc 파일이 없습니다. 나는 이제 하나를 만들고 설치하고 .babelrc 파일에 "transform-object-rest-spread"플러그인을 추가했지만 갑자기 가져 오기가 예약어라는 오류 메시지가 나타나기 시작했습니다. 그럼 .babelrc 자체 안에 ES2015 프리셋을 추가했는데 이제는 효과가있었습니다. 나는 ES2015가 이미 일한 이후로 ... 국가가 일했다고 생각했습니다. 이상한... –

답변

4

실제로, 사전 설정에 관한 것입니다.

배열 확산 ES2015 표준의 일부이며 여기

 return { 
      ...todo, //returning error 
      completed: !todo.completed 
     }; 

, 그러나 여기

 return [...state, 
      { 
      id:action.id, 
      text: action.text, 
      completed:false 
      } 
     ]; 

를 사용하면 표준의 일부하지만 a stage 2 proposal하지 object spread를 사용합니다.

당신은 바벨이 제안의 지원을 활성화해야합니다 https://babeljs.io/docs/plugins/transform-object-rest-spread/ 또는 Object.assign 전화 (this part of the proposal 참조)