Jetpack Compose Academy · บทเรียน

hiltViewModel และ @HiltViewModel

ฉีด ViewModels เข้าไปใน Composable

บทเรียน 3 จาก 413 ขั้นตอน

hiltViewModel และ @HiltViewModel เป็นบทเรียน Jetpack Compose Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 3 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน Jetpack Compose Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส Jetpack Compose Academy มีบทเรียนทั้งหมด 4 บทเรียน

ViewModels ก็ต้องการการพึ่งพาเช่นกัน

โดยทั่วไป ViewModel ของคุณจะพึ่งพารีโพซิทอรีหรือกรณีใช้งาน Hilt สามารถฉีดสิ่งเหล่านี้ให้คุณได้ คุณจึงไม่ต้องสร้างด้วยตนเองอีก

ใส่คำกำกับให้ ViewModel

กำกับคลาสด้วย @HiltViewModel และเพิ่ม @Inject ให้กับตัวสร้าง ตอนนี้ Hilt ทราบวิธีสร้างคลาสพร้อมการพึ่งพาทั้งหมดแล้ว

@HiltViewModel
class FeedViewModel @Inject constructor(private val repo: Repo) : ViewModel()

ฉีดทุกสิ่งที่จำเป็น

พารามิเตอร์ของตัวสร้างสามารถเป็นชนิดข้อมูลใดก็ได้ที่ Hilt รู้จัก เช่น รีโพซิทอรี กรณีใช้งาน หรือเครื่องบันทึกล็อก Hilt จะจัดการห่วงโซ่ทั้งหมดให้คุณ

@HiltViewModel
class FeedViewModel @Inject constructor(
    repo: Repo, logger: Logger
) : ViewModel()

เรียกใช้ใน Compose

ภายใน Composable ให้เรียก hiltViewModel() เพื่อรับ ViewModel ที่ Hilt สร้างให้ ไม่ต้องเขียนโค้ดประกอบตัวสร้าง เพียงเรียกใช้แบบกระชับครั้งเดียว

@Composable
fun FeedScreen(vm: FeedViewModel = hiltViewModel()) { }

เพิ่มการพึ่งพาของ Compose

hiltViewModel() อยู่ในอาร์ติแฟกต์ hilt-navigation-compose ให้เพิ่มอาร์ติแฟกต์นี้ในไฟล์ Gradle เพื่อให้ฟังก์ชันพร้อมใช้งานในหน้าจอของคุณ

implementation("androidx.hilt:hilt-navigation-compose:1.2.0")

รูปแบบพารามิเตอร์เริ่มต้น

การใส่ hiltViewModel() เป็นพารามิเตอร์เริ่มต้นทำให้ Composable ทดสอบได้ การทดสอบยังสามารถส่ง ViewModel จำลองเข้าไปโดยตรงได้

@Composable
fun FeedScreen(vm: FeedViewModel = hiltViewModel())

กำหนดขอบเขตตามเจ้าของ

hiltViewModel() กำหนดขอบเขตของอินสแตนซ์ตาม ViewModelStoreOwner ที่ใกล้ที่สุด ซึ่งโดยทั่วไปคือ Activity หรือปลายทางการนำทาง ทำให้อินสแตนซ์ยังคงอยู่ระหว่างการจัดองค์ประกอบใหม่

หนึ่ง ViewModel ต่อหนึ่งปลายทาง

ภายใน NavHost แต่ละ ปลายทางจะได้รับอินสแตนซ์ ViewModel ของตนเอง เมื่อออกจากหน้าจอแล้วกลับมา หน้าจอนั้นจะได้รับอินสแตนซ์ใหม่

กำกับ Activity ด้วย

Activity ที่เป็นโฮสต์ต้องมี @AndroidEntryPoint เพื่อให้ Hilt ส่ง ViewModels เข้าไปใน Composable ของ Activity ได้ หากไม่มี การฉีดจะล้มเหลว

@AndroidEntryPoint
class MainActivity : ComponentActivity()

เปิดเผยสถานะ ซ่อนตรรกะ

ViewModel ที่ถูกฉีดจะเปิดเผย สถานะ UI และหน้าจอเพียงอ่านสถานะนั้น Composable ของคุณจึงยังเรียบง่าย ขณะที่ตรรกะอยู่ในตำแหน่งเดียวที่ผ่านการทดสอบแล้ว

val state by vm.uiState.collectAsStateWithLifecycle()

ไม่ต้องสร้างตัวสร้างด้วยตนเอง

ก่อนใช้ Hilt คุณต้องเขียน ViewModelProvider.Factory สำหรับ ViewModel แต่ละตัวที่มีอาร์กิวเมนต์ Hilt จัดการโค้ดประกอบส่วนเกินเหล่านี้ออกทั้งหมด 🎁

ตรวจสอบความเข้าใจ

คู่ใดตั้งค่า ViewModel ที่ถูกฉีดด้วย Hilt สำหรับ Composable ได้อย่างถูกต้อง

สรุป: ViewModel ที่ถูกฉีด

คุณเรียนรู้การกำกับ ViewModel ด้วย @HiltViewModel และเรียกใช้ผ่าน hiltViewModel() โดยกำหนดขอบเขตตามเจ้าของและไม่ต้องเขียนโค้ดตัวสร้างเลย ✨

เริ่มต้นได้ฟรี

เรียนรู้ Kotlin ด้วย AI tutor — ฟรี

เขียนและเรียกใช้โค้ดจริงในเบราว์เซอร์ของคุณ รับความช่วยเหลือทันทีจาก AI tutor 24/7 และเรียนรู้ต่อจากที่คุณหยุดบนเว็บหรือในแอป

คอร์ส
30
บทเรียน
120

คำถามที่พบบ่อย

บทเรียน “hiltViewModel และ @HiltViewModel” ฟรีหรือไม่

ใช่ — ข้อความเต็มของ “hiltViewModel และ @HiltViewModel” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส Jetpack Compose Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส Jetpack Compose Academy มีบทเรียนทั้งหมด 4 บทเรียน

คุณจะเรียนรู้อะไรในบทเรียน “hiltViewModel และ @HiltViewModel”

ฉีด ViewModels เข้าไปใน Composable คุณปฏิบัติ Jetpack Compose Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน

คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน Jetpack Compose Academy หรือไม่

ไม่จำเป็นต้องมีประสบการณ์มาก่อน Jetpack Compose Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 3 จากทั้งหมด 4 บทเรียน

บทเรียน “hiltViewModel และ @HiltViewModel” ใช้เวลานานแค่ไหน

บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย

ฉันเขียนและรันโค้ดในบทเรียน Jetpack Compose Academy นี้ได้ไหม

ได้ บทเรียน Jetpack Compose Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ

บทเรียนทั้งหมดในหลักสูตรนี้

  1. เหตุใดจึงต้องใช้ DI: โค้ดที่ทดสอบได้และแยกส่วน
  2. โมดูล @Provides และ @Binds
  3. hiltViewModel และ @HiltViewModel
  4. ขอบเขตและอายุการใช้งานขององค์ประกอบ
← กลับไปที่ Jetpack Compose Academy