d0d8be443b
- Introduced Vue3 exercises covering composable API, reactivity, lifecycle hooks, and built-in components. - Added structured interview plan for frontend candidates focusing on HTML, CSS, JavaScript, TypeScript, and Vue. - Included starter files for each exercise and detailed README documentation for guidance.
34 lines
674 B
JavaScript
34 lines
674 B
JavaScript
const { createApp, reactive, toRef, toRefs, readonly } = Vue;
|
|
|
|
createApp({
|
|
setup() {
|
|
const profile = reactive({
|
|
name: "林晨",
|
|
stage: "Vue3 入门",
|
|
studyDays: 12,
|
|
});
|
|
|
|
const name = toRef(profile, "name");
|
|
const { stage, studyDays } = toRefs(profile);
|
|
const settings = readonly({
|
|
theme: "light",
|
|
});
|
|
|
|
function updateProfile() {
|
|
// 任务：
|
|
// 1. 更新 name.value
|
|
// 2. 更新 stage.value
|
|
// 3. 让 studyDays.value + 1
|
|
// 4. 不要直接修改 settings.theme
|
|
}
|
|
|
|
return {
|
|
name,
|
|
stage,
|
|
studyDays,
|
|
settings,
|
|
updateProfile,
|
|
};
|
|
},
|
|
}).mount("#app");
|