资料内容：

Vue 3 core features – components 
and built-in directives
Now that we have created a basic Vue app with a Vue instance, we can look more closely at 
how to make it do more. Vue 3 is a component-based framework. Therefore, components 
are the core building blocks that are used to build full production - quality Vue 3 apps. 
Components are parts that can be combined to form a full app and are reusable. Vue 3 
components have several parts, which include the template, the component option object, 
and the styles. The styles are the CSS styles that we apply to the rendered elements. The 
template is what is rendered on the browser's screen. It contains HTML code combined 
with JavaScript expressions to form the content that's rendered in the browser.
Templates get their data from the corresponding component option object. Also, the 
component templates can have directives that control how content is rendered and how to 
bind data from the template to a reactive property.
Components
We created a basic Vue app with a Vue instance. Now, we must find a way to organize our 
app in a manageable way. Vue 3 is a component-based frontend framework. This means 
that apps created with Vue 3 are created by composing multiple components into one. This 
way, we can keep each part of our app small, and this helps with making testing easy, as 
well as easy to debug. This is something that is important as we are creating a non-trivial 
app that provides functionality for users.