ๅทฒ่งฃๅ†ณ๏ผšvuejs typescript mapactions

Vue.js ๅ’Œ ๆ‰“ๅญ—็จฟ ๆ˜ฏ็ผ–็จ‹้ข†ๅŸŸ็š„ไธคไธชๅผบๅคงๅทฅๅ…ท๏ผŒๅฏไปฅๆžๅคงๅœฐ็ฎ€ๅŒ–ๅ’Œ็ฎ€ๅŒ– Web ๅบ”็”จ็จ‹ๅบๅผ€ๅ‘ใ€‚ ๆ˜ ๅฐ„ๅŠจไฝœ Vue.js ไฝฟ็”จ TypeScript ๆœ‰ๆ—ถๅฏ่ƒฝๆ˜ฏไธ€้กนๆฃ˜ๆ‰‹็š„ไปปๅŠก๏ผŒไฝ†็†่งฃๅŸบๆœฌๆฆ‚ๅฟตๅนถ้ตๅพชๆญฃ็กฎ็š„ๆญฅ้ชคๅฏไปฅไฝฟๅ…ถ่ฟ‡็จ‹ๆ›ดๅŠ ้กบๅˆฉใ€‚

้˜…่ฏปๆ›ดๅคš

ๅทฒ่งฃๅ†ณ๏ผšhtmlWebpackPlugin.options.title

HTMLWebpackPlugin ๆ˜ฏไธ€ไธชๅŠŸ่ƒฝๅผบๅคง็š„ๅทฅๅ…ท๏ผŒๅฏไปฅๆžๅคงๅœฐ็ฎ€ๅŒ– HTML ๆ–‡ไปถ็š„ๅˆ›ๅปบๆฅไธบๆ‚จ็š„ webpack ๅŒ…ๆไพ›ๆœๅŠกใ€‚ ่ฟ™ไธชๅฎž็”จ็š„ๆ’ไปถไธบๅผ€ๅ‘ไบบๅ‘˜ๆไพ›ไบ†ๅคš็ง้€‰้กน๏ผŒไฝฟๆˆ‘ไปฌ็š„ไปฃ็ ๆ›ดๅŠ ้ซ˜ๆ•ˆๅ’ŒๅŠจๆ€ใ€‚ ่ฟ™ไบ›้€‰้กนไน‹ไธ€ๆ˜ฏโ€œhtmlWebpackPlugin.options.titleโ€้€‰้กน๏ผŒๅฎƒๅ…่ฎธๆˆ‘ไปฌ่ฎพ็ฝฎ HTML ๆ–‡ไปถ็š„ๆ ‡้ข˜ใ€‚

้˜…่ฏปๆ›ดๅคš

่งฃๅ†ณ๏ผšๆœฌๅœฐๅญ˜ๅ‚จๅˆ ้™ค

ๅœจ็Žฐไปฃๆ•ฐๅญ—ไธ–็•Œไธญ๏ผŒWeb ๅบ”็”จ็จ‹ๅบๅทฒๆˆไธบๆˆ‘ไปฌๆ—ฅๅธธ็”Ÿๆดป็š„ไธ€้ƒจๅˆ†๏ผŒๅผ€ๅ‘ไบบๅ‘˜็š„่ง’่‰ฒๅŒ…ๆ‹ฌๆœ‰ๆ•ˆๅœฐ็ป„็ป‡ใ€ๅญ˜ๅ‚จๅ’Œ็ฎก็†ๆ•ฐๆฎใ€‚ ๅค„็†ๆ•ฐๆฎ็š„ไธ€ไธชๅŸบๆœฌๆฆ‚ๅฟตๆ˜ฏ**ๆœฌๅœฐๅญ˜ๅ‚จ**ใ€‚ ๆœฌๆ–‡ๅฐ†ๆทฑๅ…ฅ็ ”็ฉถๅฆ‚ไฝ•ไฝฟ็”จ JavaScript ไปŽๆœฌๅœฐๅญ˜ๅ‚จไธญๅˆ ้™คๆ•ฐๆฎ๏ผŒๆฃ€ๆŸฅไปฃ็ ็š„้€ๆญฅๅฎž็Žฐ๏ผŒๅนถ่ฎจ่ฎบไธŽๆญค่ฟ‡็จ‹็›ธๅ…ณ็š„ไธ€ไบ›ๅบ“ๅ’Œๅ‡ฝๆ•ฐใ€‚

้˜…่ฏปๆ›ดๅคš

ๅทฒ่งฃๅ†ณ๏ผš่ง‚ๅฏŸๆทฑๅฑ‚ๅฑžๆ€ง

่ง‚ๅฏŸๆทฑๅฑ‚ๅฑžๆ€งๅฏ่ƒฝๅฌ่ตทๆฅๆ˜ฏไธ€ไธชๅคๆ‚็š„ๆฆ‚ๅฟต๏ผŒไฝ†ๅฎƒๆ˜ฏ็†่งฃ JavaScript ๅฏน่ฑก่กŒไธบ็š„้‡่ฆ็ป„ๆˆ้ƒจๅˆ†ใ€‚ ๆœฌ่ดจไธŠ๏ผŒๅฎƒๅ‡่ฎพไธ€ไธชๅฏน่ฑก็š„ๅฑžๆ€งๅฏไปฅๅŒ…ๅซๅ…ถไป–ๅฏน่ฑกใ€‚ ๅ…ทไฝ“ๆฅ่ฏด๏ผŒๅœจๆ•ฐๆฎ/ๅฏน่ฑก้ฉฑๅŠจ็š„็ผ–็จ‹ไธญ๏ผŒ้žๅธธ้œ€่ฆ็›‘่ง†ใ€่ง‚ๅฏŸๆˆ–่ทŸ่ธชๅตŒๅฅ—ๅฏน่ฑกๆˆ–ๆ•ฐ็ป„ไธญ็š„ๆ›ดๆ”นใ€‚ ไธบๆญค๏ผŒๆˆ‘ไปฌๆทฑๅ…ฅๅ…ณๆณจ่ฟ™ไบ›ๅฑžๆ€งใ€‚

้˜…่ฏปๆ›ดๅคš

ๅทฒ่งฃๅ†ณ๏ผšForๅพช็Žฏ

ๆˆ‘ๅพˆไนๆ„้ตๅฎˆ๏ผŒไฝ†่ฏทๆณจๆ„๏ผŒไฝœไธบ AI ๆจกๅž‹๏ผŒๆˆ‘ๆ— ๆณ•ไปฅ HTML ๆ ‡็ญพๅœจ็ฝ‘็ซ™ไธŠ่ฟ่กŒ็š„ๆ–นๅผ้›†ๆˆๅฎƒไปฌใ€‚ ไฝ†ๅ‡บไบŽๆ–‡ๆกฃ็š„็›ฎ็š„๏ผŒๆˆ‘ไผšๅฐ†ๅฎƒไปฌๅ†™ไธ‹ๆฅใ€‚

For ๅพช็Žฏๆ˜ฏ JavaScript ไธญ็š„ไธ€ไธชๅŸบๆœฌๆฆ‚ๅฟต๏ผŒๆ˜ฏๆฏไธชๅผ€ๅ‘ไบบๅ‘˜้ƒฝ้œ€่ฆ็†Ÿๆ‚‰็š„ๅผบๅคง็ผ–็จ‹ๅทฅๅ…ทใ€‚ ๅฎƒๅ…่ฎธๆ นๆฎ็ป™ๅฎšๆกไปถ้‡ๅคๆ‰ง่กŒไปฃ็ ใ€‚ ่ฟ™ๅฏ่ƒฝ็œ‹่ตทๆฅๅพˆ็ฎ€ๅ•๏ผŒไฝ†ๆ˜ฏๅพˆๅฅฝๅœฐ็†่งฃๅฆ‚ไฝ•ๆ“ไฝœๅพช็Žฏๅฏไปฅๅฏนๆ‚จ็š„็ผ–็ ่ƒฝๅŠ›ไบง็”Ÿๅพˆๅคง็š„ๅฝฑๅ“ใ€‚

้˜…่ฏปๆ›ดๅคš

ๅทฒ่งฃๅ†ณ๏ผšๆˆชๆ–ญๆ–‡ๆœฌ

ๆˆชๆ–ญๆ–‡ๆœฌ ๆ˜ฏ Web ๅผ€ๅ‘ไธญ็š„ไธ€้กนๅธธ่งไปปๅŠก๏ผŒๅฐคๅ…ถๆ˜ฏๅœจๅค„็†้œ€่ฆ็ฌฆๅˆๆŸไบ›่กจ็คบ้™ๅˆถ่€Œไธไผšไฝฟ่ง†ๅ›พ่ถ…่ฝฝ็š„ๅ†—้•ฟๆ–‡ๆœฌๅ†…ๅฎนๆ—ถใ€‚ ่ฟ™้€šๅธธๅ‘็”Ÿๅœจๆ–ฐ้—ปๆ่ฆใ€ๆ–‡ๆœฌ้ข„่งˆ็ญ‰ๅœบๆ™ฏไธญ๏ผŒๆˆ–่€…ๅฎž้™…ไธŠไปปไฝ•ๆ‚จๅฏ่ƒฝ้€‰ๆ‹ฉโ€œ้˜…่ฏปๆ›ดๅคšโ€็ฑปๅž‹ๅŠŸ่ƒฝ็š„ๅœฐๆ–นใ€‚

้˜…่ฏปๆ›ดๅคš

ๅทฒ่งฃๅ†ณ๏ผš็ฎ€ๅ†™

JavaScript ้€Ÿ่ฎฐ็ผ–็  ๆœ‰ๆฝœๅŠ›ๆๅ‡ๆ‚จ็š„็ผ–็จ‹ไธ“ไธš็Ÿฅ่ฏ†ๅนถๆไพ›้ซ˜ๆ•ˆ็š„่งฃๅ†ณๆ–นๆกˆใ€‚ ่ฟ™็งๆŠ€ๆœฏไธไป…ไป…ๆ˜ฏ็ผ–ๅ†™ๆ›ดๅฐ‘็š„ไปฃ็ ๏ผŒ่€Œๆ˜ฏไผ˜ๅŒ–ไปฃ็ ๅนถๅขžๅผบๅฏ่ฏปๆ€ง๏ผŒๅŒๆ—ถไฟๆŒ้ซ˜ๆ€ง่ƒฝใ€‚

้€Ÿ่ฎฐ็ผ–็ ๆ˜ฏๆ‰€ๆœ‰ๅผ€ๅ‘ไบบๅ‘˜้ƒฝๅบ”่ฏฅ่€ƒ่™‘็š„ๅšๆณ•ใ€‚ ๅฎƒไธไป…ๆ้ซ˜ไบ†็ผ–ๅ†™ไปฃ็ ็š„้€Ÿๅบฆ๏ผŒ่€Œไธ”่ฟ˜ๅ‡ๅฐ‘ไบ†็Šฏ้”™่ฏฏ็š„ๆœบไผš๏ผŒๅ› ไธบๆ‚จ้œ€่ฆๆฃ€ๆŸฅ็š„่กŒๆ•ฐๆ›ดๅฐ‘ใ€‚ ๆœ‰ๅคš็งๆ–นๆณ•ๅฏไปฅๅฎž็Žฐๅฎƒ๏ผŒไฝ†ๆ‚จๅบ”่ฏฅ็‰นๅˆซๅ…ณๆณจๆœ€ๅธธ่งๅ’Œๆœ€ๆœ‰ๆ•ˆ็š„ๆ–นๆณ•ใ€‚ ๅฅฝๅค„ๆ˜ฏๆ˜พ่€Œๆ˜“่ง็š„๏ผ› ๅ‡ๅฐ‘ไปฃ็ ้‡๏ผŒๅ‡ๅฐ‘้”™่ฏฏ็š„ๅฏ่ƒฝๆ€ง๏ผŒๆ้ซ˜ๅฏ่ฏปๆ€งๅนถๅขžๅผบๆ€ง่ƒฝใ€‚

// Longhand
let a;
if (b) {
  a = c;
} else {
  a = d;
}

// Shorthand
let a = b ? c : d;

้˜…่ฏปๆ›ดๅคš

่งฃๅ†ณ๏ผšๅๅบ”ๆˆ–

-
ๅฝ“็„ถ๏ผ ่ฟ™ๆ˜ฏๅŸบไบŽ React ็š„ JavaScript ๆ–‡็ซ ็š„ๅผ€ๅง‹ใ€‚

ๅฏนไบŽไปปไฝ•ๅนฟๆณ›ไฝฟ็”จๆญค JavaScript ๅบ“็š„ไบบๆฅ่ฏด๏ผŒไบ†่งฃ React ็š„ๅ†…้ƒจๅทฅไฝœๅŽŸ็†่‡ณๅ…ณ้‡่ฆใ€‚ React ๆ˜ฏไธ€ไธชๅผ€ๆบๅ‰็ซฏ JavaScript ๅบ“๏ผŒ็”จไบŽ่ฎพ่ฎกๅ•้กตๅบ”็”จ็จ‹ๅบ็š„็”จๆˆท็•Œ้ขใ€‚ ๅฎƒๆ˜ฏ MVC๏ผˆๆจกๅž‹-่ง†ๅ›พ-ๆŽงๅˆถๅ™จ๏ผ‰ๆจกๅž‹ไธญ็š„่ง†ๅ›พๅฑ‚ใ€‚

้˜…่ฏปๆ›ดๅคš

่งฃๅ†ณ๏ผšๆทปๅŠ ๅพˆๆฃ’็š„ๅญ—ไฝ“

ๅญ—ไฝ“็œŸๆฃ’ ๆ˜ฏๅผ€ๅ‘็ฝ‘็ซ™ๆ—ถ้žๅธธๆœ‰็”จ็š„ๅทฅๅ…ทใ€‚ ๅฎƒๆ˜ฏไธ€ไธชๅบžๅคง็š„ๅฏๆ‰ฉๅฑ•็Ÿข้‡ๅ›พๆ ‡ๅบ“๏ผŒๅ…่ฎธๅผ€ๅ‘ไบบๅ‘˜ไธชๆ€งๅŒ–ๅ’Œๅขžๅผบไปปไฝ•็ฝ‘้กต็š„็พŽๆ„Ÿใ€‚ ๅฐ†ๅ…ถๆทปๅŠ ๅˆฐ JavaScript ้กน็›ฎไธไป…ๅฏไปฅไฝฟๆ‚จ็š„็ฝ‘็ซ™ๅœจ่ง†่ง‰ไธŠๆ›ดๅ…ทๅธๅผ•ๅŠ›๏ผŒ่€Œไธ”่ฟ˜ๅฏไปฅๅขžๅผบไบคไบ’ๅŠŸ่ƒฝใ€‚ ๆœฌๆ–‡ๅฐ†ๆŒ‡ๅฏผๆ‚จๅฎŒๆˆๅฐ† Font Awesome ๅˆๅนถๅˆฐ JavaScript ้กน็›ฎไธญ็š„่ฟ‡็จ‹ใ€‚

้˜…่ฏปๆ›ดๅคš