本文共 1292 字，大约阅读时间需要 4 分钟。

条件渲染

通过条件指令可以控制元素的创建(显示)或者销毁(隐藏)

• v-if

  条件判断使用 v-if 指令

• v-else

  v-else 指令给 v-if 添加一个 “else” 块

• v-else-if

  用作 v-if 的 else-if 块

• v-show

  使用v-show 指令显示和隐藏元素，与v-if最大区别在于v-show不删除元素

   
                
    
     111
    
  
            
            
    
     v-if
    
          
    
     else
    
   
            
            
    
     A
    
        
    
     B
    
        
    
     daqiu
    
        
            
    
     v-show
    
             
   
    

列表与字典对象渲染

通过v-for指令可以将一组数据渲染到页面中，数据可以是数组或者对象

语法格式： v-for= ‘’ item in items"

   
        
            
    
            
     
{
  { i }}
            
             
    
        
    
            
                 
                 
     
{
  {j+1}}、{
  {i}}
        
    
        
    
            
                 
                 
     
{
  { i }}
        
    
        
    
            
                 
     
{
  {key}}:{
  {value}}
        
    
    
   
    

绑定表单数据

v-model 指令用于设置表单控件value属性值

数据双向绑定：当数据发生变化的时候,视图也就发生变化,当视图发生变化时,数据也会跟着同步变化

• 文本输入框、下拉框框架绑定

   
        
            
            
    
     {
  {txt1}}
    
        
      
                 北京            上海            广州                
    
     {
  {sel1}}
    
  
        
   
    

• 单选框、复选框数据绑定

   
    
    
     {
  {myradio}}
    
    性别：    
        
     男    
     女    
    
     {
  {list1}}
    
    兴趣爱好：    
     读书    
     拔河    
     lol
   

转载地址：https://blog.csdn.net/weixin_43250623/article/details/90487017 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！