vue スクロールを止めた時に処理を実行する

Question

timer = false
list = ""

func(id) {
        this.list += ( id + "," )
        $("#area").scroll(function() {
            if (this.timer !== false) {
                clearTimeout(this.timer);
            }
            this.timer = setTimeout(function() {
                
                this.list = this.list.slice(0,-1)
                let params = new URLSearchParams()
                params.append("verison", this.version)
                params.append("list", this.list)
                axios.post(url_base + '', params)
                    .then(response => {
                        
                                }
                            })
                    })
            }, 200);

        });

listに文字列を追加してゆき、スクロールを止めたタイミングでaxiosでpostしたいのですが、

this.list += ( id + "," )

でブレークをはると文字列が追加されていってるのに、

this.list = this.list.slice(0,-1)

の時にはthis.listはundefinedになってしまっていてsliceができないとエラーが出ます...

Comments

[karamarimo]

timer と list は vue の data でしょうか？ func (id) もどのように呼び出されるのか分かりません。vue のコンストラクタのオプション全体を載せてもらえますか。

Answer 1

コード中に2回functionが出てきていますがここで、thisのscopeが切れているのじゃないでしょうか。
もしwebpackを使ってポリフィルが使えるのであれば、
function() {
↓
() => {
とすると、うまくいく可能性があります。
参考

もう一つはthisが変わってしまう前に別の変数に入れてしまうことがよく使われます。
いずれにせよ、thisのscopeが絡んでいそうですので、その当たりを見直してみてください

func(id) {
        this.list += ( id + "," )
        var self = this
        $("#area").scroll(function() {
            if (self.timer !== false) {
                clearTimeout(self.timer);
            }
            self.timer = setTimeout(function() {

                self.list = self.list.slice(0,-1)
                let params = new URLSearchParams()
                params.append("verison", this.version) // ←このthisはなに？
                params.append("list", self.list)
                axios.post(url_base + '', params)
                    .then(response => {

                                }
                            })
                    })
            }, 200);

        });

Comments

[退会済みユーザー]

ありがとうございます、見てみます...(>___<)

[退会済みユーザー]

thisをlet selfに入れたらできました！！！ありがとうございます(>___<)