vue.js components里data如何做到两个数据的关联?

发布于 2022-09-03 11:55:56 字数 1131 浏览 18 评论 0

import slider from './slider'
export default {
     el: '#app',
     data () {
        return {
            someList:[
                {
                    title: 'slide1',
                    img: 'testimg-1.jpg',
                },
                {
                    title: 'slide2',
                    img: 'testimg-2.jpg',
                },
                {
                    title: 'slide3',
                    img: 'testimg-3.jpg',
                }
            ],
            slideinit: {
                pageNum: this.someList.length,
                currentPage: 1,
                canPre : false,
                canNext: true,
                start: {},
                end: {},
                tracking: false,
                thresholdTime: 500,
                thresholdDistance: 100,
            }

        }
    },
    components: {
        slider
    }
}

日前,调用slider组件,需要两个数据,someListslideinit,slideinitpageNum等于someList的长度,但this.someList.length报错,未找到this.someList,请问这个问题应该如何处理?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

寄与心 2022-09-10 11:55:56

slideinit 写成计算属性:

export default {
     el: '#app',
     data () {
        return {
            someList:[
                {
                    title: 'slide1',
                    img: 'testimg-1.jpg',
                },
                {
                    title: 'slide2',
                    img: 'testimg-2.jpg',
                },
                {
                    title: 'slide3',
                    img: 'testimg-3.jpg',
                }
            ]
        }
    },
    components: {
        slider
    },
    computed: {
        slideinit () {
            return {
                pageNum: this.someList.length,
                currentPage: 1,
                canPre : false,
                canNext: true,
                start: {},
                end: {},
                tracking: false,
                thresholdTime: 500,
                thresholdDistance: 100,
            }
        }
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文