uni-app

作者: uesugieriislf | 来源:发表于2019-06-22 16:58 被阅读0次

    1.background-image的使用限制:

    h5端可以正常使用,但是app端不行。

    解决方案:图片和文字在同一个容器里面,文字覆盖图片,即文字的position:absolute。

    虽然官方回复是用base64,然而我在移动端没有实现。

    2.let that=this

    
    var time=setTimeout(function(){
    
    that.chats.push({
    
    student:'',
    
    teacher:Reply()
    
    })
    
    },2000)
    

    如果这样写,就会报错:

    image

    原因是this已经不是之前的this了,需要在外界用that把之前的this保留住

    这里还涉及到了uni-app中自定义函数的写法:写在export外面,在method中也是可以调用的。当然,直接写在method中自然是可以的。
    更正: 在微信和app端,必须要写在外面,否则无效

    3.index

    在block循环中,如果想知道此刻点击的是数组中的哪一项,无需用:data-XX="index"来传递index,只需在@click=“function(index)”中传递即可。

    这真的是非常简单了,果然是要看高手的写法才会有长进。

    4.如何返回传值?

    ps:H5端无法是用setData,因为这个是微信使用的。

    以后还是用微信开发者工具来当模拟器吧,这个和手机更接近。H5并不是自己的目标。

    场景:从A跳到B,然后再从B返回A,此时A获得B传过来的值。

    在B页面,有两种情况,一种是点击按钮返回,这时在method里面写,另一种是back返回,此时则在Unload里面写。

    内容:

    
    var currPage = pages[pages.length - 1]; //当前页面
    
    var prevPage = pages[pages.length - 2]; //上一个页面
    
    //直接调用上一个页面的setData()方法,把数据存到上一个页面中去
    
    prevPage.setData({
    
    question:this.question,//这里是你要传的值
    
    })
    
    uni.navigateBack()
    

    在A页面,在onshow中写

    
    let pages = getCurrentPages();
    
    let currPage = pages[pages.length - 1];
    
    if (currPage.data.question == "") {//这里视情况而定,有时候是‘’,有时候是undefined
    
    this.question = ''} else {
    
    this.question = currPage.data.question
    
    }
    

    currPage.data.question = '' //这句很关键,相当于清除了上一个页面的数据,这样就不会死循环了!//此处同上选择‘’或者undefined,目的是不让A页面每一次onshow都执行该函数,而是在B页面有值传递回来的时候才执行

    
    this.list1.unshift({
    
    name:'uesugieriislf',
    
    image:'/static/avatar03.jpg',
    
    content:this.question,
    
    time:'2019-5-16'
    
    })
    
    }
    
    }
    

    5.Hbuilder X的使用技巧

    快速交换

    按住Ctrl选中两处,再按shift+X即可,这个非常使用!

    反包围:

    Ctrl+】,这样可以快速实现包围一个块的功能,也很常用到

    6.事实上,一个导航栏就可以让我折腾很久了

    https://ask.dcloud.net.cn/article/34921

    在app上可以用app-plus属性来获得更多的效果。这里主要是使用了

    {
    "path":"pages/log/log","style": {
      "navigationBarTitleText":"hello",
          "app-plus": {
            "titleNView": {
              "type":"transparent"
          } 
        } 
      } 
    }
    

    来实现渐变效果

    以及

    {"path":"nav-dot/nav-dot","style": {"navigationBarTitleText":"导航栏带红点和角标","app-plus": {"titleNView": {"buttons": [ {"text":"消息","fontSize":"14","redDot":true}, {"text":"关注","fontSize":"14","badgeText":"12"} ] } } } }
    

    实现自定义button效果,可是我为何使用不了字体呢?原来是没有引入字体文件。

    "buttons" : [
    
                        { 
    
                            "text":"\ue64d", //必须写成这种形式
    
                            "fontSize" : "20", 
    
                            "width" : "auto",
    
    "fontSrc":"/static/icons/iconfont.ttf"//字体文件,不是css
    
                        } 
    
                    ] 
    

    这样就行了

    监听导航栏按钮点击事件,生命周期函数:onNavigationBarButtonTap

    取消原生导航栏"titleNView":false

    7.

    别图省事,在chrome上调试,否则你会发现自己在手机上看到的是不一样的界面。还是要用微信小程序开发工具来做调试。这个至少和手机差别不大。手机主要就是太费劲了,每次都要重启软件,我可受不了。

    8.

    在tabbar之间跳转需要用
    switchTab

    9

    如何控制循环列表种的某一项的样式
    这里也贴一个以前初学时写的一个帖子吧,当时觉得是花了不少时间才完成的“突破”,现在感觉非常丢脸,为何这么基础的东西都不懂。嗯,因为我没有系统深入地学过vue.js,用到都是非常基础的功能,所以一遇到稍微动态一些的就不会了。现在只能说是遇到的情况更多了一些。评论里第一条让我又惊又喜,而这之后则是惭愧,我的确没有打好基础啊!之后的那条我不知道他是真的想提问还是嘲讽我,我怎么学的,看文档,做项目,不懂就查,查不到就先放着,然后某一天又在别人的代码里面看到了类似的方法后突然明白了一些什么,就返回去改。我对文档了解的太少了。不过,好在有项目做,可以经常遇到一些需求,这些需求会让我慢慢触及到一些原本接触不到的东西。希望他不是嘲讽我吧。最后一个叫我大佬我真的不敢当,一个学了前端不到一年的人,怎么可能是大佬,不会的技术和框架还有一堆呢。

    10

    简书有bug啊,为何在markdown模式中的预览里面打开同步后,拉到最后会有回到开头呢?
    多个页面返回使用redirectto效果更好,这样救护会有奇怪的bug了
    h5 端正常,app端有问题。这是bug吧,为何会是这样呢?现在使用relaunch,结果又必须到start页,不然都不能返回了
    改文档是真的难受。

    相关文章

      网友评论

          本文标题:uni-app

          本文链接:https://www.haomeiwen.com/subject/kpcxzqtx.html