鍍金池/ 問答/HTML5  HTML/ vue 父組件給子組件傳值問題

vue 父組件給子組件傳值問題

想通過props 給子組件傳值,但是一直被報錯,說子組被傳遞的值未定義

clipboard.png

 components: {
                //父組件
                comments: {
                    //評論組件
                    props: ['msg','edit'],
                    methods: {
                        test: function () {
                            console.log(this)
                        }
                    },
                    data: function () {
                        return {
                            isShow: true,
                            showRepaly: false,
                            repalyText: '回復(fù)',
                           
                            isNeedReplay: true,
                           
                        }
                    },
                                    
                    template:` <div class="media" v-show='isShow'>
                                        <a class="pull-left">
                                            <img src="/Areas/Mpa/Views/Live/img/avator.png" class="media-object" />
                                        </a>
                                        <div class="media-body">
                                            <h4 class="media-heading">
                                                {{msg.userName}}
                                                <span v-if="edit">
                                                   {{msg.creationTime|formatUTC}} /
                                                    <a @@click='del'>
                                                       @L("Delete")
                                                    </a>
                                                    <a @@click='toggleRel' v-show='isNeedReplay'>
                                                            {{repalyText}}
                                                      </a>

                                                </span>
                                            </h4>
                                            <p>
                                            {{msg.theme}}
                                            </p>
                                           <transition name="stretch">
                                           <replay  :sg="isShow" v-show="showRepaly" ></replay>
                                           </transition>
                                           
                                            <hr>
                                        <slot></slot>
                                        </div>
                                  </div>`,
                    //子組件
                    components: {
                        replay: {
                            props: ['sg'],
                            data: function () {
                                return {
                                    commentText: ''
                                }
                            },
                            created: function () {
                                console.log(sg)
                            },                           
                            template: `<div class="post-comment">
                                <form role="form" >
                                    <div class="form-group">
                                        <textarea class="col-md-10 form-control" rows="3" v-model="commentText"></textarea>
                                    </div>
                                    <button class="margin-top-20 btn blue" type="submit"    @@click.prevent="submit">@L("Submit")</button>
                                </form>
                            </div>`
                        }

                    }

                }

            },
回答
編輯回答
夢若殤

console.log(this.sg)

2018年1月12日 12:35
編輯回答
厭惡我

vue1.0 版本 用 vm.sg
vue2.0 版本 用 this.sg

2017年10月19日 01:04
編輯回答
小曖昧

是console里面的sg沒定義,換成this.sg

2018年9月10日 21:13