vue-小细节以及小知识点

最新推荐文章于 2024-06-15 14:41:39 发布

webberQian

最新推荐文章于 2024-06-15 14:41:39 发布

阅读量100

点赞数

分类专栏： vue 文章标签： vue.js

本文链接：https://blog.csdn.net/qq_40628308/article/details/113886818

版权

vue 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

系列文章目录

提示：这里可以添加系列文章的所有文章的目录，目录需要自己手动添加
例如：第一章 Python 机器学习入门之pandas的使用

提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档

前言

提示：这里可以添加本文要记录的大概内容：
例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。

一、nextTick()？

Vue.nextTick 与实例上面使用nextTick 功能一样唯一的区别在于里面this指向不一样
全局的nextTick里面this指向window
实例上面使用nextTick this是指向实例的
解决办法：里面箭头函数特性将里面使用function使用箭头函数来写，this就都指向vue实例

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>vue</title>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>
</head>

<body>
    <h1 id="app">yh1{{msg}}</h1>
    <script>
        var vm = new Vue({
            el: "#app",
            data() {
                return {
                    msg: "消息"
                }
            },
            mounted() {
                 this.$nextTick(function () {
                    console.log(this) //打印vm实例
                })
                Vue.nextTick(function () {
                    console.log(this); //打印的window
                })
            },
        })
    </script>
</body>

</html>

webberQian

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
vue-小细节以及小知识点

系列文章目录提示：这里可以添加系列文章的所有文章的目录，目录需要自己手动添加例如：第一章 Python 机器学习入门之pandas的使用提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录系列文章目录前言一、nextTick()？前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。一、nextTick()？Vue.nextTick 与实例上面使用nex
复制链接

扫一扫