컴포넌트 props가 안될 때..

선생님 안녕하세요.

App.vue 에서 
html은 이렇게 하고
<Modal :원룸들="원룸들" :누른거="누른거" :모달창열렸니="모달창열렸니"/>


스크립트에서는 이렇게 하고

<script>

import data from './assets/oneroom.js';
import discount from './discount.vue';
import Modal from './modal.vue';

export default {
  name: 'App',
  data(){
    return{
      누른거 : 0,
      원룸들 : data,
      모달창열렸니 : false,
      신고수 : [0,0,0],
      네비게이션 : ['Home', 'Shop', 'About'],
      products : ['역삼동원룸', '천호동원룸', '마포구원룸'],
      price : [50, 60, 70],
      스타일 : 'color : blue',
    }
  },//데이터 보관함이 있어야됨
  methods : {
    increase(){
      this.신고수 += 1;
    }
  },
  components: {
    discount : discount,
    Modal : Modal,
  }
}
</script>

modal.vue 에서는 이렇게 했는데
<template>
  <div class="black-bg" v-if="모달창열렸니 == true">
    <div class="white-bg">
      
      <h4>{{원룸들[누른거].title}}</h4>
      <p>{{원룸들[누른거].content}}</p>
      <span>{{ 원룸들[누른거].price }}</span>
      <!-- <button @click="모달창열렸니 = false">닫기</button> -->
    </div>
  </div>
</template>
<script>
export default {
    name : 'Modal',
    props :{
        원룸들 : Array,
        누른거 : Number,
        모달창열렸니 : Boolean,
    }
}
</script>

 나오지 않고 에러메시지가 나옵니다..