学无边涯

2022年10月5日

摘要： <script> import {ref,reactive,toRefs} from 'vue' export default{ setup(){ let data=reactive({ mes:0, userObj:{ userName:'www.96net.com.cn' }, }); cons 阅读全文

posted @ 2022-10-05 17:29 学无边涯阅读(128) 评论(0) 推荐(0) 编辑

高级vue 组合api setup reactive用法

摘要： <script> import {reactive} from 'vue' export default{ setup(){ let data=reactive({ mes:0 }); const add=()=>{ //console.log('//1555'); data.mes++; cons 阅读全文

posted @ 2022-10-05 17:21 学无边涯阅读(15) 评论(0) 推荐(0) 编辑

高级vue 组合api setup ref用法

摘要： <script> import {ref} from 'vue' export default{ setup(){ let mes=ref(1); const add=()=>{ //console.log('//1555'); mes.value++; //console.log(mes) } r 阅读全文

posted @ 2022-10-05 17:15 学无边涯阅读(15) 评论(0) 推荐(0) 编辑

2022年9月25日

Vue v-bind就是用于绑定数据和元素属性

摘要： 1,href属性 <body> <p class="app"> <a v-bind:href="url">点我</a> </p> <script> var app = new Vue({ el:'.app', data:{ url:"www.gzsmbj.com", } }); </script>< 阅读全文

posted @ 2022-09-25 23:45 学无边涯阅读(31) 评论(0) 推荐(0) 编辑

Vue 组件component定义和调用

摘要： <div id="app"> <itembox></itembox> </div> <script>Vue.component("itembox",{ template:"<h2>www.gzsmbj.com</h2>"}) new Vue({ el:"#app", data:{ title:'11 阅读全文

posted @ 2022-09-25 23:21 学无边涯阅读(169) 评论(0) 推荐(0) 编辑

Vue中Class 与 Style 绑定如何加样式

摘要：你可以在对象中传入更多字段来动态切换多个 class。此外，v-bind:class 指令也可以与普通的 class attribute 共存。当有如下模板： <div class="static" v-bind:class="{ active: isActive, 'text-danger': h 阅读全文

posted @ 2022-09-25 22:44 学无边涯阅读(68) 评论(0) 推荐(0) 编辑

Vue中v-on事件和事件传值

摘要： v-on事件简写 @click <div id="app"> <ul> <button @click="mybtn({title})">{{title}}</button> </ul></div> <script> new Vue({ el:"#app", data:{ title:'11111' 阅读全文

posted @ 2022-09-25 22:31 学无边涯阅读(36) 评论(0) 推荐(0) 编辑

Vue 循环v-for列表用法

摘要： v-for 指令可以绑定数组的数据来渲染一个项目列表： <div id="app"> <ol> <li v-for="todo in todos"> {{ todo.text }} </li> </ol></div> var app = new Vue({ el: '#app', data: { t 阅读全文

posted @ 2022-09-25 20:50 学无边涯阅读(99) 评论(0) 推荐(0) 编辑

Vue 中v-if 与 v-show 区别

摘要： Vue v-if <div v-if="false"></div> 元素不会显示dom <div v-show="false"></div> 元素只是 style="display:none" 阅读全文

posted @ 2022-09-25 20:43 学无边涯阅读(21) 评论(0) 推荐(0) 编辑

Vue 条件渲染v-if ,v-else,v-else-if用法

摘要： v-if 指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回 truthy 值的时候被渲染。 <div id="app"> <p v-if="seen">www.gzsmbj.com</p></div> var app3 = new Vue({ el: '#app', data: { se 阅读全文

posted @ 2022-09-25 20:28 学无边涯阅读(276) 评论(0) 推荐(0) 编辑

公告