菜鸟001

菜鸟001 查看完整档案

北京编辑  |  填写毕业院校  |  填写所在公司/组织填写个人主网站
编辑

加油!

个人动态

菜鸟001 提出了问题 · 11月24日

vue中数据格式问题

后台返回的是字符串1,2,3,4,5
我想保留钱四个并且转化为数组格式,这样写数据为空的时候偶尔会报split错,前面加了判断也不行,还有别的方法吗请问
<view v-if="item.tags.indexOf(',') != -1" v-for="(aItem,index) in item.tags.split(',').slice(0,4)" :key="index">{{aItem}}</view>

关注 2 回答 1

菜鸟001 提出了问题 · 11月19日

vue用的better-scroll,通过ref获取dom的,转到uniapp后不支持ref,有什么办法吗大家

\` created(){
this.$nextTick(() => {
this.myScroll = new Bscroll(this.$refs.houseWrap, {
scrollY: true,
bounce: false,
click: true,
pullUpLoad: {
threshold: 744
}
})
})
},\`

关注 2 回答 1

菜鸟001 提出了问题 · 11月18日

vue的bettter-scroll可以不用dom吗,转到uniapp有问题

uniapp不支持$ref属性,无法拿到dom怎么办

关注 2 回答 1

菜鸟001 赞了回答 · 11月17日

请问一下,vue做的h5转uniapp

div,span之类常用的标签可以不用转.
比如div,会转成view,添加_div类,css里的标签选择器也会相应变化.
但是有一些行内元素也会转成view,这个有点蠢,还是需要调整下的.

生命周期基本不用调整.H5转小程序,生命周期是增加了的,不会缺失.

另外建议css单位最好调整为rpx.

关注 2 回答 1

菜鸟001 提出了问题 · 11月17日

请问一下,vue做的h5转uniapp

目前还是H5页面,div是不是不用转view,还有哪些生命周期是不是不用动,那些标签后期小程序的时候再做转化行吗### 问题描述

关注 2 回答 1

菜鸟001 提出了问题 · 11月16日

vue用的swiper组件,后来用了uniapp

swiper组件和uniapp的swiper标签冲突怎么办,如果用uniapp的swiper有些效果无法实现

关注 2 回答 1

菜鸟001 回答了问题 · 11月13日

uniapp的滚动问题scroll-view

解决了,因为多加了个属性* {
touch-action: pan-y;
}

关注 1 回答 1

菜鸟001 提出了问题 · 11月13日

uniapp的滚动问题scroll-view

无法滚动,求解,是哪里的问题
`<template>

<view>

    <view>
        <view>
            <!-- scroll-left="120";右边的元素上来的距离 -->
            <scroll-view class="scroll-view_H" scroll-x="true">
                <view class="scroll-view-item_H" v-for="(huadong,index) in huadongs" :key="index">
                    <view>x</view>
                    <view><image :data-original="huadong.img" mode=""></image></view>
                    <view>{{huadong.name}}</view>
                    <view>{{huadong.info}}</view>
                </view>
            </scroll-view>
        </view>
    </view>
    
</view>

</template>
<script>

export default {
    data() {
        return {
            huadongs:[
                {img:'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1704354617,2285391646&fm=26&gp=0.jpg',name:'舟舟',info:'xxxxxxxx'},
                {img:'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1704354617,2285391646&fm=26&gp=0.jpg',name:'舟舟',info:'xxxxxxxx'},
                {img:'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1704354617,2285391646&fm=26&gp=0.jpg',name:'舟舟',info:'xxxxxxxx'},
                {img:'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1704354617,2285391646&fm=26&gp=0.jpg',name:'舟舟',info:'xxxxxxxx'},
                {img:'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1704354617,2285391646&fm=26&gp=0.jpg',name:'舟舟',info:'xxxxxxxx'},
                {img:'https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=1704354617,2285391646&fm=26&gp=0.jpg',name:'舟舟',info:'xxxxxxxx'},
                ]
            }
    },
    methods: {
        
    }
}

</script>

<style>

.scroll-view_H {
    /* 文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。 */
    white-space: nowrap;
    width: 100%;
}
.scroll-view-item_H {
    display: inline-block;
    width: 35%;
    height: 300rpx;
    border: 1rpx solid;
    text-align: center;
    font-size: 36rpx;
    margin: 2%  1% 2% 1%;
}
.scroll-view-item_H view{
    box-sizing: border-box;
}
.scroll-view-item_H view:nth-child(1){
    width: 100%;
    text-align: right;
    padding: 1% 4%;
}
.scroll-view-item_H view:nth-child(2){
    width: 100%;
    height: 120rpx;
}
.scroll-view-item_H view:nth-child(2) image{
    width: 100rpx;
    height: 100rpx;
}
.scroll-view-item_H view:nth-child(3){
    width: 100%;
    height: 50rpx;
}
.scroll-view-item_H view:nth-child(4){
    width: 100%;
    height: 50rpx;
}

</style>
`

关注 1 回答 1

菜鸟001 赞了文章 · 11月11日

一个很好用的 vue-picker组件

vue-picker

vue-picker的组件,包括了(普通选择联动选择中国地址选择...)简单配置就可以出现一个强大的picker,感受下效果图。

vue-picker

demo

demo 地址:https://naihe138.github.io/vu...

install

npm install vue-pickers --save

使用

普通网页开发直接复制lib/vue-picker.js文件夹到项目即可直接使用

<template>
  <div>
    <VuePicker :data="pickData"
      @cancel="cancel"
      @confirm="confirm"
      :showToolbar="true"
      :maskClick="true"
      :visible.sync="pickerVisible"
    />
  </div>
</template>

<script>
  import vuePickers from 'vue-pickers'
  export default {
    components: { vuePickers },
    data () {
      let tdata = []
      for (let i = 0; i < 20; i++) {
        tdata.push({
          label: `第${i}行`,
          value: i
        })
      }
      return {
        pickerVisible: false,
        pickData: [ tdata ],
        result: ''
      }
    },
    methods: {
      cancel () {
        console.log('cancel')
        this.result = 'click cancel result: null'
      },
      confirm (res) {
        this.result = JSON.stringify(res)
        console.log(res)
      }
    },
  }
</script>

属性参数说明

参数说明是否必须类型默认值
visible显示/隐藏pickerBooleanfalse
datapickerData,多列[data1, data2]Array[]
layer联动显示列数Number0
link是否开启联动数据Booleanfalse
defaultIndex默认显示的indexNumber/[](多列用数组)
cancelText取消按钮文字String'取消'
confirmText去确认按钮文字String'确认'
titlepicker标题String''
showToolbar显示头部Booleanfalse
maskClick遮罩层是否可以点击关闭Booleanfalse
itemHeight每一行的高度Number, String'44px'
rowNumber显示多少行(建议单数)Number5

事件说明

参数说明是否必须类型默认值
change数据变化事件function(val)
cancel取消选择function
confirm确认选择function(val)
查看原文

赞 16 收藏 18 评论 103

菜鸟001 赞了回答 · 11月10日

vue的seo问题

做不做seo,取决于客户的需求,想要被搜索引擎收录链接,nuxtjs可以试一下。如果只需要部分页面被收录,可以去看看预渲染:prerender-spa-plugin。vue-ssr文档都有介绍,可以去看看

关注 2 回答 2

认证与成就

  • 获得 15 次点赞
  • 获得 58 枚徽章 获得 1 枚金徽章, 获得 13 枚银徽章, 获得 44 枚铜徽章

擅长技能
编辑

(゚∀゚ )
暂时没有

开源项目 & 著作
编辑

(゚∀゚ )
暂时没有

注册于 2017-11-21
个人主页被 865 人浏览