Vue_子级组件调用主组件函数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="app">
<!--
在组件标签上绑定的事件都vue的自定义事件。
-->
<v-xiaoshu @click="handleClick"></v-xiaoshu>
</div>
</body>
<script src="./js/vue.min.js"></script>
<script> //全局组件内 自定义组件
Vue.component("v-xiaoshu", {
//模板中p标签回调函数
template: `<p @click="handleClick">点我</p>`,
methods: {
handleClick() {
//调用组件的自定义事件
this.$emit("click");
}
}
}) var vm = new Vue({
el: "#app",
methods: {
handleClick() {
console.log("被调用")
}
}
}) </script>
</html>
Vue_子级组件调用主组件函数的更多相关文章
- vue 子组件调用父组件的函数
子组件调用父组件的函数,使用$emit(eventName,[...args]),触发当前实例上的事件.附加参数都会传给监听器回调. 子组件 <template> <div> ...
- vue 子组件调用父组件的方法
vue中 父子组件的通信: 子组件通过 props: { //子组件中写的. childMsg: { //字段名 type: Array,//类型 default: [0,0,0] //这样可以指定默 ...
- Vue子组件调用父组件的方法
Vue子组件调用父组件的方法 Vue中子组件调用父组件的方法,这里有三种方法提供参考 第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法 父组件 <temp ...
- React篇-子组件调用父组件方法,并传值
react 中子组件调用父组件的方法,通过props: 父组件: isNote(data){} <div className="tabC01"> <FTab ta ...
- Vue 子组件调用父组件 $emit
<!DOCTYPE html><html> <head> <meta charset="utf-8"> ...
- react typescript 子组件调用父组件
//父组件 import * as React from 'react'import { Input } from 'antd'const Search = Input.Searchimport &q ...
- Vue中子组件调用父组件的方法
Vue中子组件调用父组件的方法 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta ...
- 关于Vue中，父组件获取子组件的数据（子组件调用父组件函数）的方法
1. 父组件调用子组件时,在调用处传给子组件一个方法 :on-update="updateData" 2. 子组件在props中,接收这个方法并声明 props: { onUp ...
- react 父组件调用子组件方法、子组件调用父组件方法
我们闲话不多说,直接上代码 // 父组件 import React, {Component} from 'react'; class Parents extends Component { const ...
随机推荐
- 【转】CentOS 7.3 从下载到安装
CentOS 7.3 从下载到安装 https://blog.csdn.net/sxy2475/article/details/75194142 [百度知道]图解CentOS 7.3安装步骤 ht ...
- 2018-2-13-win10-uwp-从-Unity-创建
title author date CreateTime categories win10 uwp 从 Unity 创建 lindexi 2018-2-13 17:23:3 +0800 2018-2- ...
- IronPython C#与Python相互调用
ironphy microsoft.scripting dll using System;using System.Collections.Generic;using System.Linq;usi ...
- window.onload中失效的问题
在页面中,我们有时候想让页面加载的时候有多个JS事件,一般的时候我们会这样做 window.onload=function(){ alert("aaa"); } window.on ...
- MySQL慢SQL语句常见诱因
原创转载请注明出处:https://www.cnblogs.com/agilestyle/p/11429037.html 1. 无索引.索引失效导致慢查询 如果在一张几千万数据的表中以一个没有索引的列 ...
- activemq消息中间件的依赖
<dependencies> <dependency> <groupId>org.apache.activemq</groupId> <artif ...
- 每天一个Linux命令：rmdir(6)
rmdir rmdir命令用来删除空目录.当目录不再被使用时,或者磁盘空间已到达使用限定值,就需要删除失去使用价值的目录.利用rmdir命令可以从一个目录中删除一个或多个空的子目录.删除目录时,必须具 ...
- Django基础--Django基本命令、路由配置系统（URLconf）、编写视图、Template、数据库与ORM
web框架 框架,即framework,特指为解决一个开放性问题而设计的具有一定约束性的支撑结构. 使用框架可以帮你快速开发特定的系统. 简单地说,就是你用别人搭建好的舞台来做表演. 尝试搭建一个简单 ...
- spring+websocket的整合实例--可使用
spring+websocket的整合实例----借鉴如下链接--此贴用于笔记 https://blog.csdn.net/qq_35515521/article/details/78610847
- Linux系统之-介绍,主要特性
Linux是一套免费使用和自由传播的类Unix操作系统,是一个基于POSIX和UNIX的多用户.多任务.支持多线程和多CPU的操作系统.它能运行主要的UNIX工具软件.应用程序和网络协议.它支持32位 ...