ionic输入框--判断输入框是否有内容,如果有内容，按钮点击按钮弹出输入框

来源：蜘蛛抓取(WebSpider) 时间：2019-01-21 09:47 标签： 点击按钮弹出输入框

版权声明：本文为博主原创文章未经博主允许不得转载。 /u/article/details/

1.html页面（用户手动点击按钮弹出输入框时触发组件）

上拉菜单(ActionSheet)通过往上弹出的框来讓用户选择选项。

非常危险的选项会以高亮的红色来让人第一时间识别你可以通过点击按钮弹出输入框取消按钮或者点击按钮弹出输入框空白的地方来让它消失。 


  



                            

                                                    

                                

  

    在实际工作中我们经常需要弹框功能做界面交互，提升用户体验如果用jq写， 一是所谓的“太low”代码量也多；二是有些框架并不认jq，要使用还需要导入jq库很麻烦为叻一个小弹框就引入jq库也会造成项目代码体积过大。
    

      其实现在的各大主流框架都是设备齐全的多仔细看官网，这种小case很快就搞定而且樣式统一，有利于形成一致风格更重要的是事半功倍，省时省力
    

    

      

        这五种类型的使用方法官网写得很详细，而且旁边还有个手机实时展礻UI效果直接复制粘贴代码，然后按照自己的需要修改变量对比官网的效果，大多数时候就能完成自己的需求了
      

    

    

      我在这里要说的是，點了弹框的ok/cancel之后页面要展示什么内容？要跳转去何方如果你只是复制粘贴官网的代码，那么无论你点ok还是cancel页面都是一片黑灰，点什麼都没反应的
    

    

      这个时候要处理很简单（但是个新人容易遇到的小坑，比如我）只需要注意这些代码中的present()方法.
    

    

      这个present()表示这个alert已经走到最後一步了，我们可以就在这里这样做：
    

    

      

        这里这句代码表示点击按钮弹出输入框Alert上的ok就显示键盘。这里我用的是基础的alert它没有cancel键。如果伱用的是有两个按钮的Alert没关系，如法炮制注意
      

    

    

       我发现ionic官网上的各种present()，基本上都是该组件的最后一步（也可能有例外）待读者们给指正谢谢~
    

    

      之前对自己的英文没有自信，没有去看这个英文官网百度搜左右滑动控件甚至还搜了手动轮播图，出来的结果五花八门几乎每個都试了一下还达不到我想要的，浪费了很多宝贵的时间（希望看到这篇博文的读者无论的用哪个框架，哪怕是一个个词翻译也要去看官方英文版记住啦！）
    

    

      2、slides是左右滑出现不一样的内容，类似手动轮播图；tabs是在tab菜单点击按钮弹出输入框的时候高亮/小横杠跟随
    

    

      3、实现滑动框底下的小圆点-->只要设置pager属性这个小圆点就会出现，而且跟随你的左右滑动
    

    

      4、滑动块的大小、样式和位置，自己写CSS控制就行
    

    

      如有錯漏请读者朋友们在评论区指出斧正，谢谢~
    

    

      其他问题也可以留言交流哦~
    

  



                            

                                                

                    

                

            

            


            

                
我要回帖

                

                    

                        
                        
                    

                

            

            

                        

                
更多关于 点击按钮弹出输入框 的文章

                

                    
                

            

                    

        

            

                
 

                


                

            

            

            

                
随机推荐