02 2024 档案

摘要:学习教程-尚硅谷视频 将原vue2的格式改为vue3 使用setup 要点: this在vue3中被弱化,setup函数中不能使用this 定义数据时,如果不是响应式的(暂时还不是很理解响应式),不会触发页面的变化 vue3支持一个标签直接写多次,如 <template> <Person/> <Pe 阅读全文
posted @ 2024-02-29 22:55 ayubene 阅读(24) 评论(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 阅读(11) 评论(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 阅读(6) 评论(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 阅读(8) 评论(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 阅读(11) 评论(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 阅读(33) 评论(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 阅读(8) 评论(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 阅读(6) 评论(0) 推荐(0) 编辑
摘要:学习教程-vuejs官方教程 上班看不了视频,所以看文字版教程 什么是响应式 能在改变时触发更新的状态被称作是响应式的。 API reactive() 由 reactive() 创建的对象都是 JavaScript Proxy,其行为与普通对象一样 reactive() 只适用于对象 (包括数组和内 阅读全文
posted @ 2024-02-28 16:00 ayubene 阅读(6) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示