amazeui使用教程 ui 文档里的 数据接口 干啥用的

来源：蜘蛛抓取(WebSpider) 时间：2016-05-27 00:40 标签： amazeui使用教程

下面所有实例使用提供的 API 进行演示。

选择文件后会自动上传。

  • 按照右侧所示组织 HTML 结构， 按钮样式可自行修改。
  • 文件上传进度为实际上传到服务器时的实时进度。
  • 参数 header 的设置与 jQuery ajax header 设置相同，不做额外说明。查看下面实例进行设置。
  • 参数 data 设置额外的数据，用户名、密码、Cookie、token等。
  • 在文件管理器中，使用按住 ctrl 进行多选 

        

        

          

            使用参数 getFileList 获取已经上传成功后的文件及文件列表信息。
          

        

      

      

        文件上传成功后会自动更新文件列表，执行 删除 操作也会自动删除文件列表中对应的文件信息。
      

      
    
        
  1. 
          
    
            文件信息： 文件信息是已经成功上传的文件的原始信息，额外添加了 uuid 作为识别符。
          
    
        
    2. 
        
  2. 
          
    
            文件列表： 文件列表是由文件信息组成的数组。
          
    
        
    3. 
      

      

        
          

            
          

        
        
          

            
          

          

            
              限定文件大小，单位为 KB； 设为 false 不限大小
            
          

          

            
              进度条消失时间，单位 ms； 设为 false 不消失
            
          

          

            
          

          

            
          

          

            
              上传按钮模板， 用于自定义样式和配置多文件上传
            
          

        
      

      
    
        
  • 上传使用 , 故不支持 IE9
        
    • 
        
  • 
          
    
            
    
 
    
          
    
        
    • 
      

      

        事件定义在 upload 元素上。
      

      

        
          

            
          

        
        
          

            
              文件上传100%后立即触发
            
          

          

            
              在文件列表中删除文件后立即触发
            
          

        
      

    

  



                            

                                                    

                                

  

  

  

    

      

        使用 normalize.css 统一浏览器差异， 以及一些基础的元素样式。
      

    

    

      

        定义网页中常用的、多个元素组合在一起的组件样式，如分页、面包屑导航等。
      

    

  

  

  

    Amaze UI 2.0 开始移除了所有标准属性的浏览器前缀，构建时通过 自动添加。
  

  

  

    目前 Amaze UI 对大于 1025px 的屏幕并没有做划分，虽然现在大屏显示器越来越多，但是设计一个过宽的网页对用户来说并不友好，用户眼睛左右移动的区间太大，浏览起来比较累。当然，一些特殊类型（购物、视频等）的网站例外。
  

  

    LESS 变量中定义了一些 Media Query 变量，使用 LESS 的用户可以引入该文件，直接使用这些变量。
  

  

  

  

    
 

  

  

  

    不可否认，这是一个神奇的国度，一切合理与不合理都可以用国情来解释。前端开发也不例外。
  

  

  

    国内不少 X 核 浏览器，对于前端开发者，他们更多时候可能充当了 Troublemaker 的角色，不过也会有让人眼前一亮的一刻。
  

  

    这行代码可以指定网页使用 webkit 引擎渲染，当然，只对 。就这点而言，我希望所有所有的小白都去用 360 浏览器，那该有多好...
  

  

    防（zhēn）狼（cāo）术（dài）
  

  

    如果你的网站不想被剥去外衣、往赤裸的身体上贴广告，就加上。
  

  

  

  

    Amaze UI CSS class 命名遵循关注分离、松耦合的原则，同时注重易于理解、理解，在参考 的基础上，采用更优雅的书写方式。
  

  

  

    上面的代码中，可以直接使用下面的样式控制元素：
  

  

    乍看是没什么问题，这两个选择符也不会影响到 <main> 里面的元素，但是如果更改了 HTML 标签， 就必须同时修改 CSS 选择符，无疑加大了维护的工作量。所以，给相应元素加上 class 是关注分离一个不错的选择。
  

  

  

    上面是一个导航代码片段，我们给 <li> 都加上了 .am-nav-item class，表面是遵循关注分离，其实是一种反模式，因为 <ul> 里面肯定是要放 <li> 的，在没有其它更复杂的元素在里面的情况下，给
  

  

    所以， 关注分离并不是简单地给每个元素都加上 class，还需结合实际情况区别对待。
  

  

  

    当 HTML 源代码满眼望去都是 class 时，是不是很抓狂？
  

  

    不过为了实现代码复用，减少重复冗余，难免要把代码拆分在不同的 class 下面。我们只能寻找一个平衡点，避免过细的拆分，减少不必要的 class。
  

  

  

    虽然使用 LESS 编写样式可以很方便的嵌套，但是我们不建议过度嵌套选择符，有些嵌套是没有必要的。
  

  

    同时，我们也不建议把多个选择器堆叠在一起。
  

  

    看看上面来自 的选择符，威武霸气吧，整行都是选择符，class 加 class，n 层嵌套，我只想呵呵...
  

  

    选择符嵌套在必要的情况下一般不超过三层；选择符叠加一般不多于两个。
  

  

  

    我们崇尚自由，但并不是百无禁忌。
  

  

    不要单独使用、直接在里面编写样式！！！
  

  

    /* 绝不要单独用！！！ */ /* 当然，如果你想给自己找点乐，那就随便了 */
  

  

  

    不喜欢响应式？可以尝试禁用：
  

  
    
    
  • 固定容器 .am-container 宽度（可以自己添加一个 class，不一定要使用内置的）：
    
    • 
  

  

    至此，布局层的响应式被禁用了（）。
  

  

    不过，这仅仅是个开始，一些组件的样式细节可能还需要调整，只能陪你到这了……
  

  

  

    似乎有些人看着 .am 有些不顺眼，在这里专门做一下说明。
  

  

    可能有人不知道命名空间是什么东西，和 中的 yui、 中的
  

  

    命名空间使类名变得冗长，可为什么还要加呢？
  

  

  

    更直白的话说，我不犯人，也不让人犯我。
  

  

    CSS 多基于 Class 应用样式，我们不愿看到：
  

  
    
    
  • 
      多个框架共存时，按照我们的 CSS 编写的 HTML 结构应用了其他框架的样式；
    
    • 
    
  • 
      从第三方抓取的 HTML 存在 class 相同的元素，意外地应用了 Amaze UI 的样式；
    
    • 
    
  • 
      用户编写自己的代码时，意外的覆盖了框架中的样式；
    
    • 
    
  • 
      多人协作开发时，发生命名冲突，样式相互影响；__
    
    • 
    
  • 
      第三方服务（如分享按钮、评论组件）会向页面中插入一些样式，可能会意外的应用到我们编写的结构；
    
    • 
  

  

    Amaze UI 内部在用，平台上的开发者也在用，命名空间能够有效地减少这些问题。
  

  

    仅限于此，与品牌宣传什么的扯不上关系。
  

  

  

    

      一般不会，不过也说不定，不过那也是很久很久以后的事。
    

    

      我真的不喜欢命名空间这个东西，怎么办？
    

    

      未来版本会尝试自定义命名空间的可能性。你也可以尝试自己在编译的过程中把命名空间去掉，前端编译工具那么多，何不试试？不然葱油拌？还是飘香拌?
    

  

  

    妹子只能说这么多了，再往下就只能说：你不懂我，我不怪你。
  



                            

                                                

                    

                

            

            


            

                
我要回帖

                

                    

                        
                        
                    

                

            

            

                        

                
更多关于 amazeui使用教程 的文章

                

                    
                

            

                    

        

            

                
 

                


                

            

            

            

                
随机推荐