vue & arrow function error


<template>
<div class="home">
<img alt="Vue logo" src="../assets/logo.png" />
<!-- <el-button
type="primary"
@click="goTo(`./test-one`)">
goto backToTop page
</el-button> -->
<el-button
type="primary"
@click="goTo(`/test-one`)">
goto backToTop page
</el-button>
<el-button
type="primary"
@click="goTo(`/test-two`)">
goto backTop page
</el-button>
</div>
</template> <script>
// @ is an alias to /src
// import Tes from '@/components/Test.vue' export default {
name: "Home",
components: {
// Test,
},
methods: {
// goTo: (path = ``) => {
// console.log(`path =`, path, this);//
// // path = /test-one undefined
// // [Vue warn]: Error in v-on handler: "TypeError: Cannot read property '$router' of undefined"
// this.$router.push(path);
// },
// goTo: function(path = ``) {
// console.log(`path =`, path, this);//
// this.$router.push(path);
// },
goTo(path = ``) {
console.log(`path =`, path, this);//
this.$router.push(path);
},
}
};
</script>

vue router

router-link === a link

router-view === components placeholder


<template>
<div id="app">
<div id="nav">
<router-link to="/">Home</router-link> |
<router-link to="/about">About</router-link>
</div>
<!-- 挂载点 -->
<router-view />
</div>
</template>

refs



xgqfrms 2012-2020

www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!


vue & arrow function error的更多相关文章

  1. vue & lifecycle methods & this bug & ES6 Arrow function & this bind bug

    vue & lifecycle methods & this bug ES6 Arrow function & this bind bug bad fetchTableData ...

  2. vue watch & arrow function bug

    vue watch & arrow function bug watch: { GeoJSON: function(newValue, oldValue) { log(`\n\n\nGeoJS ...

  3. ES6 new syntax of Arrow Function

    Arrow Function.md Arrow Functions The basic syntax of an arrow function is as follows var fn = data ...

  4. 箭头函数 this arrow function 无this

    https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions import w ...

  5. ES Next & Arrow function & Promise & Iterator & Generator yield & Async Await

    ES Next & Arrow function & Promise & Iterator & Generator yield & Async Await co ...

  6. 廖雪峰js教程笔记5 Arrow Function(箭头函数)

    为什么叫Arrow Function?因为它的定义用的就是一个箭头: x => x * x 上面的箭头函数相当于: function (x) { return x * x; } 箭头函数 阅读: ...

  7. JavaScript学习笔记(十二)——箭头函数(Arrow Function)

    在学习廖雪峰前辈的JavaScript教程中,遇到了一些需要注意的点,因此作为学习笔记列出来,提醒自己注意! 如果大家有需要,欢迎访问前辈的博客https://www.liaoxuefeng.com/ ...

  8. arrow function and bind

    Can you bind arrow functions? https://stackoverflow.com/questions/33308121/can-you-bind-arrow-functi ...

  9. arrow function

    简介 JavaScript 中,函数可以用箭头语法(”=>”)定义,有时候也叫“lambda表达式”.这种语法主要意图是定义轻量级的内联回调函数.例如: // Arrow function: [ ...

随机推荐

  1. 抛弃 .NET 经典错误:object null reference , 使用安全扩展方法? 希望对大家有帮助---Bitter.Frame 引用类型的安全转换

    还是一样,我不喜欢长篇大论,除非关乎我设计思想领域的文章.大家过来看,都是想节省时间,能用白话表达的内容,绝不长篇大论.能直接上核心代码的,绝不上混淆代码. 长期从事 .NET 工作的人都知道..NE ...

  2. javascript之Banner图片焦点轮播

    这个Banner唯一不好的就是没有前进和后退的button,写过两个版本的banner,这次这个是下面有浮动层的. <!DOCTYPE html><html xmlns=" ...

  3. git的使用学习笔记--项目版本操作

    一.使用场景 版本回退:上线失败--需要回退到上个版本 二.操作 先编辑  vim text.txt git status git add .       这个命令能看到所有的增加操作 git com ...

  4. v-show和v-if指令的共同点和不同点?

    共同点:都能控制元素的显示和隐藏:不同点:实现本质方法不同,v-show本质就是通过控制css中的display设置为none,控制隐藏,只会编译一次:v-if是动态的向DOM树内添加或者删除DOM元 ...

  5. Redis集群数据没法拆分时的搭建策略

    在上一篇文章中,针对服务器单点.单例.单机存在的问题: 单点故障 容量有限 可支持的连接有限(性能不足) 提出了解决的办法:根据AKF原则搭建集群,大意是先X轴拆分,创建单机的镜像,组成主主.主备.主 ...

  6. python 拼接字

    在编译脚本的时候,由于脚本的框架是统一写好的,于是乎用上了拼接字的功能, 本脚本实现的是波特率设置的自动化,利用的是正则表达式,TASK函数是统一写好的,此处只做调用 from Args import ...

  7. GitLab开发流程图示、Git命令一张图

    GitLab开发流程图示.Git命令一张图 一.GitLab开发流程图示 二.Git命令一张图 作图工具:ProcessOn 一.GitLab开发流程图示 二.Git命令一张图

  8. docker启动脚本

    #!/bin/bash # 定义环境变量 export LANG="en_US.UTF-8" #统一格式化打印输出信息 printMsg(){ echo "$(date ...

  9. Python遍历目录下xlsx文件

    对指定目录下的指定类型文件进行遍历,可对文件名关键字进行条件筛选 返回值为文件地址的列表 import os # 定义一个函数,函数名字为get_all_excel,需要传入一个目录 def get_ ...

  10. Java并发包源码学习系列:阻塞队列实现之LinkedBlockingDeque源码解析

    目录 LinkedBlockingDeque概述 类图结构及重要字段 linkFirst linkLast unlinkFirst unlinkLast unlink 总结 参考阅读 系列传送门: J ...