useMotionTemplate
useMotionTemplate 创建一个新的motion 值从一个字符串模板包含其他 motion 值。
const x = useMotionValue(100) const transform = useMotionTemplate`transform(${x}px)`
每当字符串模板中的 motion 值更新时，返回的 motion 值将使用最新值更新。
用法
从 Motion 导入
import { useMotionTemplate } from "motion/react"
useMotionTemplate 是一个“标记模板”，因此它不是像普通函数那样被调用，而是作为字符串模板被调用
useMotionValue``
此字符串模板可以接受文本和其他 motion 值
const blur = useMotionValue(10) const saturate = useMotionValue(50) const filter = useMotionTemplate`blur(${10}px) saturate(${saturate}%)` return <motion.div style={{ filter }} />
返回的 motion 值的最新值将是字符串模板，其中每个提供的 motion 值都替换为其最新值。
const shadowX = useSpring(0) const shadowY = useMotionValue(0) const filter = useMotionTemplate`drop-shadow(${shadowX}px ${shadowY}px 20px rgba(0,0,0,0.3))` return <motion.div style={{ filter }} />
useMotionTemplate 创建一个新的motion 值从一个字符串模板包含其他 motion 值。
const x = useMotionValue(100) const transform = useMotionTemplate`transform(${x}px)`
每当字符串模板中的 motion 值更新时，返回的 motion 值将使用最新值更新。
用法
从 Motion 导入
import { useMotionTemplate } from "motion/react"
useMotionTemplate 是一个“标记模板”，因此它不是像普通函数那样被调用，而是作为字符串模板被调用
useMotionValue``
此字符串模板可以接受文本和其他 motion 值
const blur = useMotionValue(10) const saturate = useMotionValue(50) const filter = useMotionTemplate`blur(${10}px) saturate(${saturate}%)` return <motion.div style={{ filter }} />
返回的 motion 值的最新值将是字符串模板，其中每个提供的 motion 值都替换为其最新值。
const shadowX = useSpring(0) const shadowY = useMotionValue(0) const filter = useMotionTemplate`drop-shadow(${shadowX}px ${shadowY}px 20px rgba(0,0,0,0.3))` return <motion.div style={{ filter }} />
useMotionTemplate 创建一个新的motion 值从一个字符串模板包含其他 motion 值。
const x = useMotionValue(100) const transform = useMotionTemplate`transform(${x}px)`
每当字符串模板中的 motion 值更新时，返回的 motion 值将使用最新值更新。
用法
从 Motion 导入
import { useMotionTemplate } from "motion/react"
useMotionTemplate 是一个“标记模板”，因此它不是像普通函数那样被调用，而是作为字符串模板被调用
useMotionValue``
此字符串模板可以接受文本和其他 motion 值
const blur = useMotionValue(10) const saturate = useMotionValue(50) const filter = useMotionTemplate`blur(${10}px) saturate(${saturate}%)` return <motion.div style={{ filter }} />
返回的 motion 值的最新值将是字符串模板，其中每个提供的 motion 值都替换为其最新值。
const shadowX = useSpring(0) const shadowY = useMotionValue(0) const filter = useMotionTemplate`drop-shadow(${shadowX}px ${shadowY}px 20px rgba(0,0,0,0.3))` return <motion.div style={{ filter }} />
