Context

Every component has a $context object, which can be used to pass values down the component tree without adding props to every component in between. Assign a value in a parent component:


import UserProfile from "./UserProfile.torp"

export default function App() {
	$context.user = {
		name: "John"
	}

	@render {
		<UserProfile />
	}
}

Then read it in any descendant component:


export default function UserProfile() {
	let user = $context.user

	@render {
		<p>
			Hello, {user.name}!
		</p>
	}
}

Any string (or symbol) can be used as a context key, and $context.key is the same as $context["key"]. Values assigned to context may be reactive objects created with $watch, in which case updates to them will be reflected throughout the tree.