JavaScript\u3067\u5206\u5c90\u30d5\u30e9\u30b0\u3092\u6383\u304d\u51fa\u3057\u3001Vue\u306e If(\u307e\u305f\u306fCase)\u3067\u914d\u5217\u306e\u8981\u7d20\u307e\u3067\u30b4\u30ea\u30b4\u30ea\u66f8\u304f<\/li>\n<\/ol>\n<\/div>\nPUG\u3067\u306e\u30eb\u30fc\u30d7\u306b\u62d8\u3089\u306a\u3051\u308c\u3070\u624b\u6bb5\u306f\u3044\u304f\u3064\u3082\u3042\u308a\u307e\u3059\u3002<\/p>\n
\u4eca\u56de\u306f2\u306e\u65b9\u6cd5\u3092\u63a1\u7528<\/h3>\n
\u307e\u3041\u306d\u3001\u5148\u306b\u914d\u5217\u4f5c\u3063\u3066\u308b\u3057\u4f5c\u308a\u5909\u3048\u308b\u624b\u9593\u304c\u6e1b\u308a\u307e\u3059\u304b\u3089\u306d\u3002<\/p>\n
<ul>\r\n <li v-for=\"vl in blinks\" :key=\"vl.url\">\r\n <router-link :to=\"{path:vl.url}\" > {{vl.txt}}<\/router-link>\r\n <\/li>\r\n<\/ul><\/pre>\nHome.vue\u3067\u3053\u3093\u306a\u5f62\u3067\u8a18\u8f09\u3059\u308c\u3070\u30ea\u30f3\u30af\u3092\u5c55\u958b\u3057\u3066\u304f\u308c\u307e\u3059\u3002<\/p>\n
\u30c1\u30e7\u30c3\u30c8\u89e3\u8aac<\/h4>\n
\u25a02\u884c\u76ee\uff1a\u300e v-for=\" \u25a0 in \u25a0s\" \u300f<\/p>\n
\u3053\u308c\u304cVue\u306e each in \u3067\u3059\u3002Laravel\u3067\u8a00\u3046\u6240\u306eforeach\u3002
\n\u4ed6\u306e\u8a00\u8a9e\u306b\u6163\u308c\u3066\u3044\u308b\u3068\u60a9\u3080\u3068\u3053\u308d\u306f\u3010\u30eb\u30fc\u30d7\u3092\u66f8\u304f\u5834\u6240\u3011\u3060\u3068\u601d\u3044\u307e\u3059\u3002
\nVue\u306e\u5834\u5408\u306f\u300c\u7e70\u308a\u8fd4\u3057\u305f\u3044\u30bf\u30b0\u306e\u5834\u6240\u3067\u8a18\u8f09\u3059\u308b\u300d\u3053\u3068\u306b\u306a\u308a\u307e\u3059\u3002
\nLaravel\u3068\u304b\u3060\u3068<ul>\u3068<li>\u306e\u9593\u306b\u30eb\u30fc\u30d7\u51e6\u7406\u66f8\u304d\u307e\u3059\u304c\u3001\u305d\u3046\u3067\u306f\u306a\u3044\u306e\u3067\u60a9\u3093\u3060\u672b\u306b<ul>\u306b\u66f8\u3044\u3066\u3057\u307e\u3046\u4e8b\u304c\u306a\u3044\u3088\u3046\u306b\u899a\u3048\u3066\u304a\u304d\u307e\u3057\u3087\u3046\u3002<\/p>\n
\u25a03\u884c\u76ee\uff1a\u300e <router-link :to=\"{path:vl.url}\" > \u300f<\/p>\n
\u4eca\u56de\u3053\u306e\u51e6\u7406\u304c\u4e00\u756a\u60a9\u307f\u307e\u3057\u305f\u3002<\/p>\n
{{vl.url}}\u3068\u3059\u308b\u3068\u30c6\u30ad\u30b9\u30c8\u3092\u5410\u304d\u51fa\u3059\u306e\u3067\u3001\u3064\u3044\u3064\u3044 <router-link :to=\"{{vl.url}}\">\u3068\u3057\u3066\u3057\u307e\u3044\u307e\u3059\u304c\u3001\u3053\u308c\u3060\u3068\u30a8\u30e9\u30fc\u304c\u767a\u751f\u3057\u307e\u3059\u3002<\/p>\n
> 1 | 0({{vl.url}})\r\n | ^ vue\/no-parsing-error<\/pre>\nrouter-link\u306eto=\u306b\u5909\u6570\u3092\u6e21\u3059\u5834\u5408\u306f\u6b21\u306e\u30eb\u30fc\u30eb\u306b\u5f93\u3044\u8a18\u8f09\u3057\u3066\u3044\u304d\u307e\u3059\u3002<\/p>\n
\n
\n- \u6587\u5b57\u5217\u5909\u6570\u3092\u5165\u308c\u308b\u5834\u5408(\u203b\u4eca\u56de\u306e\u5834\u5408)\u306f \"{ path : \u6587\u5b57\u5217\u5909\u6570 }\" \u3068\u3059\u308b<\/li>\n
- \u56fa\u5b9a\u6587\u5b57\u5217\u3092\u5165\u308c\u308b\u5834\u5408\u306f \"{ name : '\u56fa\u5b9a\u6587\u5b57\u5217' }\" \u3068\u3059\u308b<\/li>\n
- router\u306b\u5f15\u6570\u767b\u9332\u304c\u3042\u308b\u5834\u5408\u306f\u305d\u306e\u5024\u3092\u5ba3\u8a00\u3057\u3066\u914d\u7f6e\u3059\u308b (\u4f8b\uff1a\"{params: {id: task.id, edit_id: 10}}\" \u203bid \/ edit_id \u3092router.js \u3067\u5ba3\u8a00\u3057\u3066\u3044\u308b\u5834\u5408\u3001\u305d\u306e\u7b87\u6240\u306b\u5024\u3092\u683c\u7d0d\u3059\u308b [ path: '\/:id\/edit\/:edit_id', ] )<\/li>\n
- \u5909\u6570\u3084\u5b9a\u6570\u3092\u30ab\u30f3\u30de\u3067\u7d9a\u3051\u305f\u5834\u5408\u3001\u30b9\u30e9\u30c3\u30b7\u30e5\u3067\u7d9a\u3051\u305f\u5024\u306b\u5909\u63db\u3055\u308c\u308b<\/li>\n<\/ol>\n<\/div>\n
\u6298\u89d2\u306a\u306e\u3067\u3001\u5148\u7a0b\u4f5c\u6210\u3057\u305fVue\u30b9\u30af\u30ea\u30d7\u30c8\u3092PUG\u306b\u5909\u63db\u3057\u3066\u307f\u308b<\/h3>\n
Home.vue\u306b\u66f8\u3044\u305f\u5148\u7a0b\u306eScript\u3092PUG\u3067\u66f8\u3044\u3066\u307f\u305f\u3044\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n
ul\r\n li(v-for='vl in blinks' :key='vl.url')\r\n router-link(:to='{path:vl.url}') {{vl.txt}}<\/pre>\n\u307e\u3041\u306d\u3001\u305d\u3053\u307e\u3067\u3057\u3066PUG\u3067\u66f8\u304f\u5fc5\u8981\u304c\u3042\u308b\u304b\u3063\u3066\u611f\u3058\u306b\u306a\u308b\u306e\u306f\u91cd\u3005\u627f\u77e5\u3057\u3066\u307e\u3059\u304c\u3002
\n\u3068\u308a\u3042\u3048\u305a\u3001\u3053\u3093\u306a\u5f62\u306b\u3059\u308c\u3070PUG\u306bJavaScript\u306e\u5f15\u6570\u3092\u6e21\u3059\u306e\u3068\u540c\u3058\u7d50\u679c\u306e\u5b9f\u88c5\u304cPUG\u3092\u4f7f\u3063\u3066\u53ef\u80fd\u3067\u3059\u3002<\/p>\n
\u307e\u3068\u3081<\/h3>\n
Vue\u00d7Pug\u00d7JS\u00d7SCSS\u3068\u3044\u3046\u7d44\u307f\u5408\u308f\u305b\u306e\u30da\u30fc\u30b8\u4f5c\u6210\u3092\u3059\u308b\u3053\u3068\u304c\u3042\u308b\u3068\u601d\u3044\u307e\u3059\u3002
\n\u305d\u3057\u3066\u3001\u6ca2\u5c71\u306e\u30e9\u30a4\u30d6\u30e9\u30ea\u304c\u7d61\u3081\u3070\u300c\u3069\u3046\u3057\u3066\u3082\u8d85\u3048\u3089\u308c\u306a\u3044(\u51fa\u6765\u306a\u3044)\u4e8b\u300d\u3082\u5f53\u7136\u51fa\u3066\u304d\u307e\u3059\u3002
\n\u305d\u3093\u306a\u6642\u306f\u5225\u30eb\u30fc\u30c8\u3092\u8003\u3048\u308b\u3068\u89e3\u6c7a\u65b9\u6cd5\u304c\u5fc5\u305a\u3042\u308b\u306e\u304c\u30d7\u30ed\u30b0\u30e9\u30e0\u306e\u918d\u9190\u5473\u3002
\n\u697d\u3057\u3044\u3067\u3059\u306d\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"
Vue+Pug\uff1aJavaScript\u3067\u4f5c\u6210\u3057\u305f\u5909\u6570\u3092Pug\u3067\u8aad\u8fbc\u3082\u3046\u3068\u3057\u305f\u304c\u51fa\u6765\u306a\u3044\u3089\u3057\u3044 \u305d\u3082\u305d\u3082PUG\u3063\u3066\u4f55\uff1f\u3068\u3044\u3046\u65b9\u306f\u3053\u3061\u3089\u3092\u53c2\u8003\u306b\u3002 JS\u3067\u4f5c\u6210\u3057\u305f\u914d\u5217\u3092\u57fa\u306b\u3057\u3066PUG\u3067\u30ea\u30f3\u30af\u30ea\u30b9\u30c8\u3092\u66f8\u3053\u3046\u3068\u601d\u3044\u5f53\u521d\u3001\u4e0b\u306e\u3088\u3046\u306a […]<\/p>\n","protected":false},"author":1,"featured_media":2762,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"sns_share_botton_hide":"","vkExUnit_sns_title":"","_vk_print_noindex":"","sitemap_hide":"","_veu_custom_css":"","veu_display_promotion_alert":"","vkexunit_cta_each_option":"","_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2},"jetpack_post_was_ever_published":false},"categories":[42,37],"tags":[976,365,974,977,966,978,975,959],"class_list":["post-2779","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-html-memorandum","category-java-memorandum","tag-each-in","tag-javascript","tag-pug","tag-v-for","tag-vue-js","tag-978","tag-975","tag-959"],"veu_head_title_object":{"title":"","add_site_title":""},"jetpack_publicize_connections":[],"jetpack-related-posts":[],"jetpack_sharing_enabled":false,"jetpack_featured_media_url":"https:\/\/qol-kk.com\/wp2\/wp-content\/uploads\/2021\/03\/vuejs.png","_links":{"self":[{"href":"https:\/\/qol-kk.com\/wp2\/wp-json\/wp\/v2\/posts\/2779","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/qol-kk.com\/wp2\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/qol-kk.com\/wp2\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/qol-kk.com\/wp2\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/qol-kk.com\/wp2\/wp-json\/wp\/v2\/comments?post=2779"}],"version-history":[{"count":0,"href":"https:\/\/qol-kk.com\/wp2\/wp-json\/wp\/v2\/posts\/2779\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/qol-kk.com\/wp2\/wp-json\/wp\/v2\/media\/2762"}],"wp:attachment":[{"href":"https:\/\/qol-kk.com\/wp2\/wp-json\/wp\/v2\/media?parent=2779"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/qol-kk.com\/wp2\/wp-json\/wp\/v2\/categories?post=2779"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/qol-kk.com\/wp2\/wp-json\/wp\/v2\/tags?post=2779"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}