vue.timeout의 구성 요소에 개체 배열 전달

vue.timeout의 구성 요소에 개체 배열 전달

Vue.js 2.2의 컴포넌트에 오브젝트 배열을 전달하는 데 문제가 있습니다.

여기 제 컴포넌트가 있습니다.

<vue-grid :fields = "[
  {name: 'Person Name', isSortable: true}, 
  {name: 'Country', isSortable: true}]"
></vue-grid>

브라우저에 물결 괄호를 표시하기 때문에 동작하지 않습니다.
견적서 없이 해봤는데"결장 없이 물체 안에서:앞에fields소유물.이것들 중 어느 것도 효과가 없다.하지만 간단한 문자열만 넘기면 됩니다.오브젝트가 왜 작동하지 않는지 모르겠어요.
비슷한 질문을 찾았지만 php에 대한 답변이 있었습니다.자바스크립트 전용 솔루션이 필요합니다.컴포넌트 내의 오브젝트 어레이를 하드코드로 만들고 싶다.

당신은 그것을 정확하게 통과하고 있다.뒤에서 무슨 일이 벌어지고 있는 게 틀림없어요.템플릿에 래핑 요소가 있는지 확인합니다.이 바이올린을 보세요.

<div id="vue-app">
    <h2>
        Vue App
    </h2>
    <vue-grid :fields = "[
        {name: 'Person Name', isSortable: true}, 
        {name: 'Country', isSortable: true}]"
    ></vue-grid>
</div>
<script id="vue-grid-template" type="text/x-template">
    <div>
        <h3>Grid</h3>
        <div class="grid">
            Fields are:
            <ul>
                <li v-for="field in fields">
                    {{field.name}} - {{field.isSortable}}
                </li>
            </ul>
        </div>
    </div>
</script>

<script>
    Vue.component('vue-grid', {
        props: ['fields'],
        template: '#vue-grid-template'
    });

    new Vue({
        el: '#vue-app'
    });
</script>

언급URL : https://stackoverflow.com/questions/43299365/passing-array-of-objects-to-a-component-in-vue-js