{"id":2310,"date":"2020-02-05T11:24:16","date_gmt":"2020-02-05T02:24:16","guid":{"rendered":"https:\/\/naoya-ono.com\/blog\/?p=2310"},"modified":"2020-04-29T13:45:49","modified_gmt":"2020-04-29T04:45:49","slug":"call-method","status":"publish","type":"post","link":"https:\/\/naoya-ono.com\/blog\/call-method\/","title":{"rendered":"\u3010Vue.js\u3011\u89aa\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u304b\u3089\u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u30e1\u30bd\u30c3\u30c9\u3092\u547c\u3073\u51fa\u3059\u65b9\u6cd5"},"content":{"rendered":"<p>\u3053\u306e\u30da\u30fc\u30b8\u3067\u306f\u3001Vue.js\u306e\u89aa\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u304b\u3089\u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u30e1\u30bd\u30c3\u30c9\u3092\u547c\u3073\u51fa\u3059\u65b9\u6cd5\u306b\u3064\u3044\u3066\u7d39\u4ecb\u3057\u307e\u3059\u3002<\/p>\n<div id=\"toc_container\" class=\"no_bullets\"><p class=\"toc_title\">\u76ee\u6b21<\/p><ul class=\"toc_list\"><li><a href=\"#i\">\u3084\u308a\u65b9<\/a><ul><li><a href=\"#1_ref\">1. \u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306bref\u5c5e\u6027\u3092\u4f7f\u3063\u3066\u4efb\u610f\u306e\u540d\u524d\u3092\u3064\u3051\u308b<\/a><\/li><li><a href=\"#2\">2. \u89aa\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u30e1\u30bd\u30c3\u30c9\u5185\u304b\u3089\u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u30a4\u30d9\u30f3\u30c8\u3092\u767a\u706b<\/a><\/li><\/ul><\/li><\/ul><\/div>\n<h2 class=\"hh hh5 pastel-bc\" id=\"i-0\"><span id=\"i\">\u3084\u308a\u65b9<\/span><\/h2>\n<p>\u3084\u308a\u65b9\u306f\u6b21\u306e\u901a\u308a\u3067\u3059\u3002<\/p>\n<div class=\"sng-box box2\">\n<div class=\"ol-circle li-accentbdr acc-bc-before\">\n<ol>\n<li>\u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306bref\u5c5e\u6027\u3092\u4f7f\u3063\u3066\u4efb\u610f\u306e\u540d\u524d\u3092\u3064\u3051\u308b\u3002<\/li>\n<li>\u89aa\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u30e1\u30bd\u30c3\u30c9\u5185\u304b\u3089\u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u30a4\u30d9\u30f3\u30c8\u3092\u767a\u706b<\/li>\n<\/ol>\n<\/div>\n<\/div>\n<h3 id=\"i-1\"><span id=\"1_ref\">1. \u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306bref\u5c5e\u6027\u3092\u4f7f\u3063\u3066\u4efb\u610f\u306e\u540d\u524d\u3092\u3064\u3051\u308b<\/span><\/h3>\n<p>\u307e\u305a\u306f\u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306bref\u5c5e\u6027\u3092\u4f7f\u3063\u3066\u540d\u524d\u3092\u3064\u3051\u307e\u3059\u3002<\/p>\n<p><span class=\"labeltext accent-bc\">Parent.vue<\/span><\/p>\n<div class=\"hcb_wrap\">\n<pre class=\"prism line-numbers lang-plane\" data-lang=\"\u30b3\u30fc\u30c9\u30d6\u30ed\u30c3\u30af\"><code>&lt;child-component ref=\"child\"&gt;&lt;\/child-component&gt;<\/code><\/pre>\n<\/div>\n<p>\u3053\u306e\u3088\u3046\u306b\u8a18\u8ff0\u3059\u308b\u3053\u3068\u3067\u3001\u89aa\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u304b\u3089\u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u3092\u53c2\u7167\u3067\u304d\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n<p>\u4e0a\u306e\u4f8b\u3067\u306f\u3001\u300cchild\u300d\u3068\u3044\u3046\u540d\u524d\u306b\u3057\u3066\u3044\u307e\u3059\u304c\u3001\u306a\u3093\u3067\u3082OK\u3067\u3059\u3002<\/p>\n<p>\u308f\u304b\u308a\u3084\u3059\u3044\u540d\u524d\u3092\u3064\u3051\u307e\u3057\u3087\u3046\u3002<\/p>\n<h3 id=\"i-2\"><span id=\"2\">2. \u89aa\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u30e1\u30bd\u30c3\u30c9\u5185\u304b\u3089\u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u30a4\u30d9\u30f3\u30c8\u3092\u767a\u706b<\/span><\/h3>\n<p>\u7d9a\u3044\u3066\u3001\u89aa\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u304b\u3089\u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u30a4\u30d9\u30f3\u30c8\u3092\u767a\u706b\u3057\u307e\u3059\u3002<\/p>\n<p><span class=\"labeltext accent-bc\">Parent.vue<\/span><\/p>\n<div class=\"hcb_wrap\">\n<pre class=\"prism line-numbers lang-plane\" data-lang=\"Plane Text\"><code>methods: {\n    showModal: function() {\n    \/\/ \u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u30e1\u30bd\u30c3\u30c9\u547c\u3073\u51fa\u3057\n    this.$refs.child.showModal()\n   }\n}<\/code><\/pre>\n<\/div>\n<p>\u547c\u3073\u51fa\u3057\u65b9\u6cd5\u306f\u300c<strong>this.$refs.ref\u5c5e\u6027\u306b\u6307\u5b9a\u3057\u305f\u540d\u524d.\u547c\u3073\u51fa\u3057\u305f\u3044\u30a4\u30d9\u30f3\u30c8\u540d<\/strong>\u300d\u306e\u3088\u3046\u306b\u66f8\u304d\u307e\u3059\u3002<\/p>\n<p>\u4e0a\u306e\u4f8b\u306e\u5834\u5408\u3001\u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306b\u3042\u308b\u300c<strong>showModal()<\/strong>\u300d\u30e1\u30bd\u30c3\u30c9\u304c\u547c\u3070\u308c\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n<p><span class=\"labeltext accent-bc\">Child.vue<\/span><\/p>\n<div class=\"hcb_wrap\">\n<pre class=\"prism line-numbers lang-plane\" data-lang=\"Plane Text\"><code>methods: {\n  showEditModal: function(){\n      this.showModal = true\n      this.showModalBg = true\n}<\/code><\/pre>\n<\/div>\n<div id=\"rinkerid1616\" class=\"yyi-rinker-contents  yyi-rinker-postid-1616 yyi-rinker-img-m yyi-rinker-catid-31 yyi-rinker-catid-3 \">\n<div class=\"yyi-rinker-box\">\n<div class=\"yyi-rinker-image\">\n\t\t\t\t\t\t\t<a href=\"https:\/\/www.amazon.co.jp\/dp\/4863542453?tag=naoya-ono-22&amp;linkCode=ogi&amp;th=1&amp;psc=1\" rel=\"nofollow\" class=\"yyi-rinker-tracking\" data-click-tracking=\"amazon_img 1616 \u57fa\u790e\u304b\u3089\u5b66\u3076 Vue.js\" data-vars-click-id=\"amazon_img 1616 \u57fa\u790e\u304b\u3089\u5b66\u3076 Vue.js\"><img decoding=\"async\" loading=\"lazy\" src=\"https:\/\/m.media-amazon.com\/images\/I\/51UVfJB+8sL._SL160_.jpg\" width=\"112\" height=\"160\" class=\"yyi-rinker-main-img\" style=\"border: none;\"><\/a>\t\t\t\t\t<\/div>\n<div class=\"yyi-rinker-info\">\n<div class=\"yyi-rinker-title\">\n\t\t\t\t\t\t\t\t\t<a href=\"https:\/\/www.amazon.co.jp\/dp\/4863542453?tag=naoya-ono-22&amp;linkCode=ogi&amp;th=1&amp;psc=1\" rel=\"nofollow\" class=\"yyi-rinker-tracking\" data-click-tracking=\"amazon_title 1616 \u57fa\u790e\u304b\u3089\u5b66\u3076 Vue.js\" data-vars-amp-click-id=\"amazon_title 1616 \u57fa\u790e\u304b\u3089\u5b66\u3076 Vue.js\">\u57fa\u790e\u304b\u3089\u5b66\u3076 Vue.js<\/a>\t\t\t\t\t\t\t<\/div>\n<div class=\"yyi-rinker-detail\">\n<div class=\"credit-box\">created by&nbsp;<a href=\"https:\/\/oyakosodate.com\/rinker\/\" rel=\"nofollow noopener\" target=\"_blank\">Rinker<\/a><\/div>\n<div class=\"price-box\">\n\t\t\t\t\t\t\t<\/div>\n<\/p><\/div>\n<ul class=\"yyi-rinker-links\">\n<li class=\"amazonkindlelink\">\n\t\t\t\t\t\t<a href=\"https:\/\/www.amazon.co.jp\/gp\/product\/B07D9BYHMZ\/ref=as_li_qf_asin_il_tl?ie=UTF8&amp;tag=naoya-ono-22&amp;creative=1211&amp;linkCode=as2&amp;creativeASIN=B07D9BYHMZ&amp;linkId=77138cffdded68c736738fa99634f5d4\" rel=\"nofollow\" class=\"yyi-rinker-link yyi-rinker-tracking\" data-click-tracking=\"amazon_kindle 1616 \u57fa\u790e\u304b\u3089\u5b66\u3076 Vue.js\" data-vars-amp-click-id=\"amazon_kindle 1616 \u57fa\u790e\u304b\u3089\u5b66\u3076 Vue.js\">Kindle<\/a>\t\t\t\t\t<\/li>\n<li class=\"amazonlink\">\n\t\t\t\t\t\t<a href=\"https:\/\/www.amazon.co.jp\/dp\/4863542453?tag=naoya-ono-22&amp;linkCode=ogi&amp;th=1&amp;psc=1\" rel=\"nofollow\" class=\"yyi-rinker-link yyi-rinker-tracking\" data-click-tracking=\"amazon 1616 \u57fa\u790e\u304b\u3089\u5b66\u3076 Vue.js\" data-vars-amp-click-id=\"amazon 1616 \u57fa\u790e\u304b\u3089\u5b66\u3076 Vue.js\">Amazon<\/a>\t\t\t\t\t<\/li>\n<li class=\"rakutenlink\">\n\t\t\t\t\t\t<a href=\"https:\/\/hb.afl.rakuten.co.jp\/hgc\/16781883.64066d33.16781884.4f333982\/Rinker_o_20191215175655?pc=https%3A%2F%2Fsearch.rakuten.co.jp%2Fsearch%2Fmall%2F%25E5%259F%25BA%25E7%25A4%258E%25E3%2581%258B%25E3%2582%2589%25E5%25AD%25A6%25E3%2581%25B6%2BVue.js%25C2%25A0%2F%3Ff%3D1%26grp%3Dproduct&amp;m=https%3A%2F%2Fsearch.rakuten.co.jp%2Fsearch%2Fmall%2F%25E5%259F%25BA%25E7%25A4%258E%25E3%2581%258B%25E3%2582%2589%25E5%25AD%25A6%25E3%2581%25B6%2BVue.js%25C2%25A0%2F%3Ff%3D1%26grp%3Dproduct\" rel=\"nofollow\" class=\"yyi-rinker-link yyi-rinker-tracking\" data-click-tracking=\"rakuten 1616 \u57fa\u790e\u304b\u3089\u5b66\u3076 Vue.js\" data-vars-amp-click-id=\"rakuten 1616 \u57fa\u790e\u304b\u3089\u5b66\u3076 Vue.js\">\u697d\u5929\u5e02\u5834<\/a>\t\t\t\t\t<\/li>\n<li class=\"yahoolink\">\n\t\t\t\t\t\t<a href=\"https:\/\/shopping.yahoo.co.jp\/search?p=%E5%9F%BA%E7%A4%8E%E3%81%8B%E3%82%89%E5%AD%A6%E3%81%B6+Vue.js%C2%A0\" rel=\"nofollow\" class=\"yyi-rinker-link yyi-rinker-tracking\" data-click-tracking=\"yahoo 1616 \u57fa\u790e\u304b\u3089\u5b66\u3076 Vue.js\" data-vars-amp-click-id=\"yahoo 1616 \u57fa\u790e\u304b\u3089\u5b66\u3076 Vue.js\">Yahoo\u30b7\u30e7\u30c3\u30d4\u30f3\u30b0<\/a>\t\t\t\t\t<\/li>\n<li class=\"freelink2\">\n\t\t\t\t\t\t<a href=\"https:\/\/www.kinokuniya.co.jp\/f\/dsg-01-9784863542457\" rel=\"nofollow\" class=\"yyi-rinker-link yyi-rinker-tracking\" data-click-tracking=\"free_2 1616 \u57fa\u790e\u304b\u3089\u5b66\u3076 Vue.js\" data-vars-amp-click-id=\"free_2 1616 \u57fa\u790e\u304b\u3089\u5b66\u3076 Vue.js\">\u7d00\u4f0a\u570b\u5c4b\u66f8\u5e97<\/a>\t\t\t\t\t<\/li>\n<\/ul><\/div>\n<\/p><\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>\u3053\u306e\u30da\u30fc\u30b8\u3067\u306f\u3001Vue.js\u306e\u89aa\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u304b\u3089\u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u30e1\u30bd\u30c3\u30c9\u3092\u547c\u3073\u51fa\u3059\u65b9\u6cd5\u306b\u3064\u3044\u3066\u7d39\u4ecb\u3057\u307e\u3059\u3002 \u76ee\u6b21\u3084\u308a\u65b91. \u5b50\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306bref\u5c5e\u6027\u3092\u4f7f\u3063\u3066\u4efb\u610f\u306e\u540d\u524d\u3092\u3064\u3051\u308b2. \u89aa\u30b3\u30f3\u30dd\u30fc\u30cd\u30f3\u30c8\u306e\u30e1\u30bd\u30c3\u30c9\u5185\u304b\u3089 &#8230; <\/p>\n","protected":false},"author":1,"featured_media":2337,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[31,3],"tags":[],"_links":{"self":[{"href":"https:\/\/naoya-ono.com\/blog\/wp-json\/wp\/v2\/posts\/2310"}],"collection":[{"href":"https:\/\/naoya-ono.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/naoya-ono.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/naoya-ono.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/naoya-ono.com\/blog\/wp-json\/wp\/v2\/comments?post=2310"}],"version-history":[{"count":4,"href":"https:\/\/naoya-ono.com\/blog\/wp-json\/wp\/v2\/posts\/2310\/revisions"}],"predecessor-version":[{"id":2336,"href":"https:\/\/naoya-ono.com\/blog\/wp-json\/wp\/v2\/posts\/2310\/revisions\/2336"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/naoya-ono.com\/blog\/wp-json\/wp\/v2\/media\/2337"}],"wp:attachment":[{"href":"https:\/\/naoya-ono.com\/blog\/wp-json\/wp\/v2\/media?parent=2310"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/naoya-ono.com\/blog\/wp-json\/wp\/v2\/categories?post=2310"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/naoya-ono.com\/blog\/wp-json\/wp\/v2\/tags?post=2310"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}