1 asked

0

안녕하세요 cjy2957님, Override 쪽에서 질문이 있으시군요.

현재 framer는 지속적인 업데이트로 인해 화면 및 규격이 계속 바뀌고 있어요. 말씀주신 화면은 framer의 Override 기능을 활용하는 Library가 "Override from framer"에서 "ComponentType from react"로 바뀌어서 생기는 현상입니다.

import type { ComponentType } from "react"
import { Override } from "framer"
// 각기 다른 Library에서 import

export function withHoverComponentType(Component): ComponentType {
    return (props) => {
        return <Component {...props} whileHover={{ scale: 1.05 }} />
    }
}
// ComponentType을 이용한 code

export function withHoverOverride(props): Override {
    return {
        whileHover: { scale: 1.05 }
    }
}
// Override를 이용한 code

상기 코드는 ComponentType과 Override Library를 사용한 간단한 코드인데요, 보이는 모습은 다르지만 완전히 동일한 기능을 가지고 있습니다. 현재 framer에서 새로운 Override 코드를 생성하면 말씀주신 내용과 같은 화면이 나올거에요. 그 내용을 모두 지우고 강의 속 코드를 그대로 활용하면 작동합니다! 다만 새로운 코드를 사용하면 속도랑 버그와 같은 부분에서 좀 더 자유롭다고 볼 수 있겠네요.

문의주신 내용을 강의 전반에 모두 담기에는 너무 변경된 부분이 많아서요, 업데이트보다는 새로운 강의로 찾아뵙는게 더 효과적일 것 같아요. 다만 본업이 바빠서(핑계...) 추후 강의는 시간이 걸릴 듯 합니다.

좀 더 자세한 내용은 framer의 Override API 문서를 참고 부탁드립니다.

강의 봐주셔서 감사합니다!