Vue父組件的值傳給子組件

Vue父組件的值傳給子組件

1. 自己網上搜到一種方法

我做的是獲取父組件表格每一行作爲參數
父組件：這個params要在data中賦初始值

//這是script裏的代碼
export default {
	data ()  {
	  return：{
	  params: ''
	  }
	},
	method: {
		getParams: function (row, index) {
		  this.params = [JSON.stringify(row)]
		}
	}
}

子組件：

	method: {
		getData () {
		const params = this.$parent.$vnode.context.params
		console.log(this.params)
		//下面就是根據父組件傳過來的參數調取接口
		}
	}

這時候可以console一下看他輸出的值,也可以打斷點找到自己想要的值。

2. 最常用的方法props( )

父組件：

<template>
	<div>
		<Child :params="params"></Child>
	</div>
</template>
<script>
export default {
	data ()  {
	  return：{
	  params: ''
	  }
	},
	method: {
		getParams: function (row, index) {
		  this.params = [JSON.stringify(row)]
		}
	}
}
</script>

子組件：

export default {
  components: {
    Child
  },
  props: {
    params: {
      type: Array,
      default: function () { return [] }
    }
  },
 }

鏈接: https://mp.csdn.net/mdeditor/103299788