Team Project-Apple Market_3일차_Flutter

2025.12.30 (화)
역할분담 - detail page 구현

---

-> 벌써 뭐 이렇게 합치고 가져오고 .. 화이팅!../

-> 이렇게 만들거에요

Detail Page 작업을 시작했다. 시작하자마자 에러 발생한 것을 기록해보려 한다

🍎 Apple Market 프로젝트 트러블 슈팅 기록

📌 문제: imageUrl 에러

• 상황: DetailPage의 이미지 표시 부분(imageUrl)에서 빨간 줄 에러가 발생했다.

• 당시의 판단: 당장 에러 때문에 화면이 안 나오니, 일단 이미지 코드를 주석 처리하고 나머지 UI(상품명, 가격, 설명 등)부터 먼저 작업하려고 했다,, 급한만큼 얼른!

---

📌 전환점: 팀원들과의 코드 리뷰 (Code Review)

오늘 하루 작업한 내용을 팀원들에게 공유하며 코드 리뷰를 진행했다. 코드 리뷰를 진행하면서 이미지를 단순히 주석 처리하고 넘어가는 것보다, 지금 이 시점에서 에러를 제대로 해결하는 것이 좋겠다는 의견이 나와서 에러 처리를 진행해봤다..!

body: ListView(
        children: [
          Column(
            children: [
              // 이미지
              Image.asset(
                Item.imageUrl, fit: BoxFit.cover),

• 오류: Instance member 'imageUrl' can't be accessed using static access.

• 오류 원인: 정적(Static) 접근과 인스턴스(Instance) 접근의 혼동

• 분석: DetailPage는 StatefulWidget이므로, 부모로부터 전달받은 데이터에 접근하려면 widget.item.imageUrl형식을 사용해야 함.

📌 해결 과정 (Action)

사실 플러터 업데이트가 된 후로 자꾸 얘가 코드를 대신 써주거나 고쳐주는데.. 자꾸 widget. 어쩌고 뜨길래 이거 관련해서 구글링해서 찾아보다가 해결할 수 있었다.

• 수정 방향
  widget. 키워드를 사용하여 데이터 인스턴스에 정확히 접근하도록 수정.

body: ListView(
  children: [
    Column(
      children: [
        // 이미지 분기처리
        _ProductImage(widget.item.imageUrl),

// 이미지 분기처리 함수
Widget _productImage(String? imageUrl, {required BoxFit fit}) {
  if (imageUrl == null || imageUrl.isEmpty) {
    return const SizedBox.shrink();
  }
  return Image.network(
    imageUrl,
    fit: fit,
  );

급하게 자동완성으로 만들어봤다.. 이해는 되는데 자동완성 꺼야겠다.

응.. 이제 남은 내용 얼른 해보러 가보자~! 👻