摘要：
尚硅谷视频链接 计算属性：算出一个ref定义的响应式数据 定义只读的计算属性 let fullName = computed(()=>{ return firstName.value.slice(0,1).toUpperCase() + firstName.value.slice(1) + '-' 阅读全文
posted @ 2024-03-04 22:06
ayubene
阅读(18)
评论(0)
推荐(0)
摘要：
尚硅谷视频教程 响应式数据 vue2中，写在data()里的数据自动成为响应式数据 vue3定义响应式数据，使用ref()或reactive() 什么是响应式数据：数据改变时。页面随之变化，即为响应式数据 ref() 创建基本类型的响应式数据 首先引入ref import { ref } from 阅读全文
posted @ 2024-03-03 22:30
ayubene
阅读(50)
评论(0)
推荐(0)
摘要：
学习教程-尚硅谷视频 将原vue2的格式改为vue3 使用setup 要点： this在vue3中被弱化，setup函数中不能使用this 定义数据时，如果不是响应式的（暂时还不是很理解响应式），不会触发页面的变化 vue3支持一个标签直接写多次，如 <template> <Person/> <Pe 阅读全文
posted @ 2024-02-29 22:55
ayubene
阅读(54)
评论(0)
推荐(0)
摘要：
学习教程 使用 v-for 指令来渲染一个基于源数组的列表 <ul> <li v-for="todo in todos" :key="todo.id"> {{ todo.text }} </li> </ul> 更新列表的方式1（添加元素） todos.value.push(newTodo) 更新列表 阅读全文
posted @ 2024-02-29 14:36
ayubene
阅读(32)
评论(0)
推荐(0)
摘要：
使用教程 使用 v-if , v-else 指令来有条件地渲染元素： 如下例，当 awesome 值为真值 (Truthy) 时渲染第一个 h1 ，否则渲染第二个 h1 <h1 v-if="awesome">Vue is awesome!</h1> <h1 v-else>Oh no 😢</h1> 阅读全文
posted @ 2024-02-29 11:13
ayubene
阅读(22)
评论(0)
推荐(0)
摘要：
学习教程 同时使用 v-bind 和 v-on 来在表单的输入元素上创建双向绑定： <input :value="text" @input="onInput"> 在文本框里输入，同时更新 里的文本。实现如下 <script setup> import { ref } from 'vue' const 阅读全文
posted @ 2024-02-29 11:04
ayubene
阅读(19)
评论(0)
推荐(0)
摘要：
教程链接 使用 v-on 指令监听 DOM 事件 <button v-on:click="increment">{{ count }}</button> 简写语法 <button @click="increment">{{ count }}</button> <script setup> impor 阅读全文
posted @ 2024-02-29 10:52
ayubene
阅读(18)
评论(0)
推荐(0)
摘要：
学习教程-官方教程 在 Vue 中，mustache 语法 (即双大括号) 只能用于文本插值。为了给 attribute 绑定一个动态值，需要使用 v-bind 指令： <div v-bind:id="dynamicId"></div> v-bind 专门的简写语法： <div :id="dynam 阅读全文
posted @ 2024-02-29 10:43
ayubene
阅读(50)
评论(0)
推荐(1)
摘要：
尚硅谷视频教程 main.ts import { createApp } from 'vue' import App from './App.vue' createApp(App).mount('#app') App.vue 使用vue2语法 <template> <!-- html --> <di 阅读全文
posted @ 2024-02-28 23:22
ayubene
阅读(21)
评论(0)
推荐(0)
摘要：
尚硅谷vue3+Typescript教程 安装node.js 安装教程 创建项目 npm create vue@latest 运行项目 npm run dev 出现报错“'vite' 不是内部或外部命令，也不是可运行的程序或批处理文件。” 处理方式 安装依赖npm i .vue文件结构 <templ 阅读全文
posted @ 2024-02-28 23:14
ayubene
阅读(12)
评论(0)
推荐(0)
浙公网安备 33010602011771号