一            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2023-05-19 15:19:41
                            
                                366阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            <a-table rowKey="id" bordered               :dataSource="dataSource"               :columns="colu            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-07-06 11:37:58
                            
                                921阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            data里面这样写: img: require("../../../static/img/new-view.png"), 标签这样写:            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-03-02 14:37:10
                            
                                926阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            一,v-bind:class 一个对象,以动态地切换 class: <div class="static" v-bind:class="{ active: isActive, 'text-danger': hasError }"> </div> 结果为:<div class="static acti ...            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-08-26 14:34:00
                            
                                351阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            使用场景: 带单当前选中项cur样式判定; 不同模块参数不同颜色显示; 使用方法: 对象语法 <div class="static" v-bind:class="{ active: isActive, 'text-danger': hasError }"></div>data如下:data: { i ...            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-09-10 15:48:00
                            
                                217阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            <template> <div class="todo-item" :class="{'is-complete':todo.completed}"> <p> <input type="checkbox" @change="markComplete"> {{todo.title}} </p> </di            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-04-19 16:39:46
                            
                                161阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            本小节我们将介绍 Vue 中如何动态绑定样式。包括 Class 的绑定、内联样式 Style 的绑定。掌握样式绑定的多种形式是其中的重点难点。同学们可以在学完本小节之后对样式的绑定方式加以总结,再通过反复的练习来加深印象。            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2023-01-28 06:48:33
                            
                                600阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            // 绑定单个内联样式    <view :style="{'display':config.isHaveSearch ? 'block':'none'}" ></view>    <view :style="{color:item.age<18?'#ccc':''}"></view>    <view :style="{ color:            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-03-02 11:01:38
                            
                                685阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            <div :class="{active:item.index==1}" > </div>            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-04-20 13:42:02
                            
                                129阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            常用动态绑定样式:class先看下官方文档:对象语法 :class="{ property : truth }"动态绑定class,我们            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2019-07-12 11:18:55
                            
                                766阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            核心代码buttonClick(methodName) {    this[methodName]()},完            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-07-12 16:05:13
                            
                                1469阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            由于之前的 vue 项目打包成果物一直是嵌入集成平台中,所以一直没有关注过项目的 title。直到最近,突然有个需求,要求点击按钮在集成平台外新开一个页面,此时我才发现,原来我的项目的 title 一直是万年不变的 vue-project。理所应当的,这个问题被测试爸爸提了一个大大的缺陷。 犯了错的            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2020-12-11 16:19:00
                            
                                483阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            1 安装npm install vue-wechat-title --save 或 npm install vue-wechat-title -S2使用,在main.js中引用插件import VueWechatTitle from 'vue-wechat-title'Vue.use(VueWechatTitle)3在路由router文件 index.js 中给每个路由添加 titleexport default new Router({  routes: [    {..            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2021-11-29 16:34:34
                            
                                865阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            其实也没啥,就是一句代码的事,只不过看在哪里执行而已。            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-08-15 10:23:48
                            
                                942阅读
                            
                                                                             
                 
                
                             
         
            
            
            
             
VUE对象的动态绑定
vue不检测对象的删除和添加
动态添加对象属性
动态添加对象属性的双向绑定的实现
 
vue不检测对象的删除和添加
vue不能检测到对象的删除和添加,因为vue初始化实例的时候对属性进行一个get和set的过程,因此我们对象上的属性必须要在初始化的时候存在才可以进行动态的绑定的,以下的例子就是我们的没有添加对象的时候的动态绑定,例子是在iview Run上跑的地址是            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2021-07-16 09:31:05
                            
                                10000+阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            VUE对象的动态绑定vue不检测对象的删除和添加动态添加对象属性动态添加对象属性的双向绑定的实现vue不检测对象的删除和添加vue不能检测到对象的删除和添加,因为vue初始化实例的时候对属性进行一个get和set的过程            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-02-11 16:26:20
                            
                                1412阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            <ul class="fmenu">                <li v-for="item in submenu" :class="[{active:$route.path==('/home/'+secondRoute+'/'+item.path)},{majornav:secondRoute=='majorintro'},{majornavactive:$route.p            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-03-02 14:30:43
                            
                                857阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            Vue的基本语法插值操作Mustache 也叫作胡子语法,{{message}},此时{{}}为胡须语法。{{message}},单值{{message + firstname}}多值操作{{message +’ s '+ firstname}}多值操作并且可以在其里面加上自定义字符串{{counter * 2}} 在里面进行加减乘除操作v-once 只会在第一次的时候进行元素赋值,无法在后面进行            
                
         
            
            
            
            一、知识点动态绑定:vue-class:三目写法对象写法数组写法vue-style:三目写法对象写法数组写法二、代码示例1. vue-classvue-class三目写法<head>
		<meta charset="utf-8">
		<script src="./js/vue.js"></script><!-- 引入vue.js -->            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-10-03 09:13:37
                            
                                83阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            VUE基础:Class/Style绑定在很多业务画面,某些元素的样式是动态变化的。Vue中的Class/Style绑定就是为了实现动态样式效果的技术手段。Vue针对v-bind 用于 class 和 style 时做了针对的增强处理,表达式结果的类型除了普通的字符串之外,同时还可以支持对象以及数组类型。6.1 Class绑定6.1.1 简单绑定最简单的绑定:此处active不加单引号也可以同样能够