精华内容
下载资源
问答
  • 钉钉小程序

    2019-10-11 10:51:18
    在dd.httpRequest({})中无法获取this对象,需要在请求外面定义变量去过渡钉钉变量 this.setData({ 'array[0]': 1, 'obj.x':2, }); 2. dataset 在组件中可以定义数据,这些数据将会通过事件传递给逻辑层。 <.....

    一. setData 改变对应的this.data的值

    1. 注意:不要直接修改this.data对应的数据。
    2. 在dd.httpRequest({})中无法获取this对象,需要在请求外面定义变量去过渡钉钉变量
    this.setData({
      'array[0]': 1,
      'obj.x':2,
    });
    

    二. dataset 在组件中可以定义数据,这些数据将会通过事件传递给逻辑层。

    <view data-alpha-beta="1" data-alphaBeta="2" onTap="bindViewTap"> DataSet Test </view>
    
    Page({
      bindViewTap:function(event){
        event.target.dataset.alphaBeta === 1 // - 会转为驼峰写法
        event.target.dataset.alphabeta === 2 // 大写会转为小写
      }
    })
    

    三. 在page中定义的分页面,页面元素不能使用.page类名,否则会与app的样式冲突。

    四. 绘制F2图表,图表图例 legend不够显示,可以考虑添加css样式 padding 值。tooltip提示信息遮挡部分内容时,考虑 设置 offsetY

    五. 钉钉中使用iconFont

    第一种:引用iconfont第三方域名在线链接

    • 进入iconFont官网,在 【Unicode】 选项中, 选择【查看在线链接】
    • 选择相对应的icon图标,【取最后四位】使用
    //1.css
    @font-face {    
      font-family: 'iconfont'; /* project id 800366 */
      src: url('//at.alicdn.com/t/font_800366_tdlza9osbci.eot');
      src: url('//at.alicdn.com/t/font_800366_tdlza9osbci.eot?#iefix') format('embedded-opentype'),
             url('//at.alicdn.com/t/font_800366_tdlza9osbci.woff') format('woff'),
             url('//at.alicdn.com/t/font_800366_tdlza9osbci.ttf') format('truetype'),
             url('//at.alicdn.com/t/font_800366_tdlza9osbci.svg#iconfont') format('svg');
    }
    .iconfont {
      font-family: "iconfont" !important;
      font-size: 60rpx;
    }
    .icon-mediation-case:before {content: "\e6a0"}
    //2.代码中引用
    <view class="iconfont icon-backColor-case icon-mediation-case"></view>   
    

    第二种:直接下载转化为base64使用

    • 进入iconFont官网,在 【Unicode】 选项中, 选择【下载至本地】
    • 在https://transfonter.org/,将下载文件中的【iconfont.ttf】文件转化为base64文件,下载后取出【stylesheet.css】复制到本地【app.acss】中进行复用。

    六. 钉钉发布相关

    1. 官方组件文档:钉钉组件 F2图表
    2. 发布钉钉流程:
    1. 编辑器左上角选择 【关联应用】【体验组织】后,右上角 【上传】
    2. 发布体验版 钉钉开发平台 ,选择登录管理后台的企业和管理密码,选择【应用开发】,找到相应的版本将发布的版本设置为 体验版。
    3. 发正式版本都需要在编辑器左上角选择【企业内部应用】

    七. 钉钉websocket

    // 钉钉 websocket 
    Page({
      data: {},
      onLoad() {
        dd.showLoading({ content: '数据加载中...' });
        dd.onSocketClose(function(res) {
          console.log('WebSocket 已关闭!')
        })
    
        let url = app.globalData.baseUrl_ws;
        dd.connectSocket({ url: url });
          
        dd.onSocketOpen(function(res) {
          // dd.alert({ content: '连接已打开!' });
        });
    
        dd.onSocketError(function(res) {
          // dd.alert('WebSocket 连接打开失败,请检查!' + res);
        });
    
        dd.onSocketMessage(function(res) {
          dd.hideLoading();
          let params = JSON.parse(res.data);
        })  
      }
    })
    
    // 原生webSocket
    let url = app.globalData.baseUrl_ws;
    let ws = new WebSocket(url);
    ws.onopen = function () {
        console.log('连接成功');
    }
    ws.onmessage = function (event) {
        dd.hideLoading();
        let params = JSON.parse(event.data);
    }
    
    展开全文
  • 之前发过一篇教程:如何在钉钉小程序使用iconfont 在项目开发完成后,测试时,发现在android上iconfont不会生效 原因 在请教了钉钉的大佬后,得出原因,低版本android他不支持woff2格式的字体,必须要使用woff格式字体,...

    问题

    之前发过一篇教程:如何在钉钉小程序使用iconfont

    在项目开发完成后,测试时,发现在android上iconfont不会生效

    原因

    在请教了钉钉的大佬后,得出原因,低版本android他不支持woff2格式的字体,必须要使用woff格式字体,由于从默认iconfont网站上下载来的字体,woff2排在woff之前,所以导致android无法正确识别到woff了

    一般情况下你的iconfont.acss可能是这个样子的:

    @font-face {font-family: "iconfont";
      src: url('iconfont.eot?t=1557465831153'); /* IE9 */
      src: url('iconfont.eot?t=1557465831153#iefix') format('embedded-opentype'), /* IE6-IE8 */
      url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAA...') format('woff2'),
      url('iconfont.woff?t=1557465831153') format('woff'),
      url('iconfont.ttf?t=1557465831153') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
      url('iconfont.svg?t=1557465831153#iconfont') format('svg'); /* iOS 4.1- */
    }
    

    原因参考:Custom fonts (woff2) doesn’t work in Android making App with Visual Studio Comunity and Cordova

    解决方案

    思路就是干掉iconfont.acss中的woff2,但之后又发现,钉钉小程序无法识别本地的woff文件…

    这时,我们有两个方案来解决这个问题

    1.使用base64内联字体文件

    1.首先找到你的iconfont.woff文件
    2.找一个能在线转换woff为base64格式的网站,这里推荐:https://transfonter.org/
    3.勾选base64 encode,其他默认,截图仅供参考
    在这里插入图片描述
    点击convert后,你应该得到了一份转化后的字体文件,打开stylesheet.css,找到woff格式的base64代码,整行复制,放到你钉钉小程序的iconfont.acss里替换原来的font-face的src,其他类型的iconfont其实都可以删掉了
    在这里插入图片描述
    4.重点来了!!!必须要把url里的base64代码用''括起来,不然还是不能在钉钉里用

    完成后你的iconfont.acss应该是这样子的

    @font-face {
      font-family: "iconfont";
      src: url('data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAAAkUAA0AAAAADXAA...') format('woff');
      /* 转化成base64的woff */
    }
    .... //其他不动,省略
    

    2.使用https路径的字体文件

    这是钉钉大佬提供的方案,由于我直接用的base64,这个方案我还没实践过,其实很简单

    1.把本地的woff上传到服务器上,
    2.内联的woffurl改成https

    由于我没实践过,希望有人能测试下并在评论里反馈下是否可用,这里提供个大概的伪代码

    @font-face {font-family: "iconfont";
      src: url('https://yourdomain/iconfont.woff') format('woff');
    }
    
    展开全文
  • 使用iconfont E应用使用lodash 发版时清除缓存 钉钉扫码预览编译失败 mini-ddui 文档

    修复钉钉小程序 iconfont在android客户端无法正常显示

    点击查看 修复钉钉小程序 iconfont在android客户端无法正常显示

    swipie-action组件增强

    点击查看 swipie-action组件增强

    E应用生成预览调试及生产带参数二维码或链接

    点击查看 E应用生成预览调试及生产带参数二维码或链接

    使用iconfont

    钉钉小程序是可以使用iconfont的,虽然官方文档没有说
    首先把iconfont解压到项目目录下,并把iconfont.css重命名为iconfont.acss

    ---src
    	-font
    		-iconfont.acss
    		...//其他iconfont文件
    

    app.acss或其他acss文件里引用

    @import '/font/iconfont.acss';
    

    在页面上使用,就跟普通的html一样

    <text class="iconfont icon-xiangxiajiantou"></text>
    

    E应用使用Lodash

    首先yarn add lodash

    之后如果直接在页面里引用整个lodash库,在IDE可以正常运行,但是发布生产后会报错register worker err ...之类

    建议单独引入具体要用到的工具类

    //不建议
    import _ from 'lodash'
    
    //建议
    import _filter from 'lodash/filter'
    

    发版时清除缓存

    钉钉小程序E应用在发版时会有一个老版本的缓存,每次发版后直接打开E应用,其实访问的是上一个版本的缓存,这个缓存会在发版后10分钟左右自动更新成最新版本,如果想要直接看到最新版本,可以退出钉钉登录账户,并杀掉钉钉进程,这样再进去后就是直接访问的最新版本了.

    钉钉扫码预览编译失败

    编译失败查看日志,通常是超过5M了,这个5M怎么来的呢,其实是把根目录下的debug.log一起编译到项目中了

    所以直接删除这个debug.log就可以编译通过了

    mini-ddui 文档

    自从官网API文档某次更新之后,mini-ddui的文档就没有了

    后来求助官方群的兄弟,给了一条明路,直接找支付宝小程序的 mini-ddui 库就行了.

    不过支付宝版本的一直在更新,接口和钉钉E应用的还是有部分区别,文档只能略作参考

    首先,安装类库还是用原来的mini-ddui

    yarn add mini-ddui
    

    mini-ddui库 支付宝版文档

    实在不行,拷组件出来自己造轮子吧

    mini-ddui库 支付宝版 github地址

    展开全文
  • 文章目录tabBar: 以前开发微信小程序,现在应公司需求改钉钉,两者还是有差距的。接下来说一些坑: 钉钉开发平台: ...钉钉小程序和微信小程序的差别——————直接上代码: 钉钉小程序: "tabBar

    以前开发微信小程序,现在应公司需求改钉钉,两者还是有差距的。接下来说一些坑:

    由于进期开发钉钉小程序,所以本片博客持续更新。。。。。

    钉钉开发平台:

    https://developers.dingtalk.com/document/app/dd-addtabbaritem

    tabBar:

    tabBar不显示:

    1.注意字段是否写错
    2.可以尝试清理缓存
    3.list里面至少要有两个,最多五个,一个是不行的
    4.必须有pages里面的index页面

    钉钉小程序和微信小程序的差别——————直接上代码:
    钉钉小程序:

    "tabBar": {
        "backgroundColor": "#FFFFFF",      //tabBar的背景颜色(建议使用“#”开头的)
        "items": [
          {
            "pagePath": "pages/index/index",   //页面记得加index页面
            "name": "1",        //tabBar中的文字
            "icon": "images/tabBar_imgs/shouye.png",      //未选择时的图标样式
            "activeIcon": "images/tabBar_imgs/shouye2.png"     //选中时的图标样式
          },
          {
            "pagePath": "pages/Allist/Allist",
            "name": "2",
            "icon": "images/tabBar_imgs/dashuju.png",
            "activeIcon": "images/tabBar_imgs/dashuju2.png"
          },
          {
            "pagePath": "pages/workbench/workbench",
            "name": "3",
            "icon": "images/tabBar_imgs/gongzuotai.png",
            "activeIcon": "images/tabBar_imgs/gongzuotai2.png"
          },
          {
            "pagePath": "pages/My/My",
            "name": "4",
            "icon": "images/tabBar_imgs/wode.png",
            "activeIcon": "images/tabBar_imgs/wode2.png"
          }
        ]
      }
    

    微信小程序:

    "tabBar": {
        "selectedColor": "#ff77c4",
        "list": [
          {
            "pagePath": "pages/index/index",     //页面记得加index页面
            "text": "11",      //tabBar中的文字
            "iconPath": "images/tabbar/home.png",      //未选择时的图标样式
            "selectedIconPath": "images/tabbar/home_active.png"     //选中时的图标样式
          },
          {
            "pagePath": "pages/demo/demo",
            "text": "22",
            "iconPath": "images/tabbar/cart.png",
            "selectedIconPath": "images/tabbar/cart_active.png"
          },
          {
            "pagePath": "pages/logs/logs",
            "text": "33",
            "iconPath": "images/tabbar/category.png",
            "selectedIconPath": "images/tabbar/category_active.png"
          },
          {
            "pagePath": "pages/my/my",
            "text": "44",
            "iconPath": "images/tabbar/profile.png",
            "iconPath": "images/tabbar/profile_active.png"
          }
        ]
      },
    

    刚开始搞钉钉小程序时,没注意icon的字段应该怎么写,感觉和微信小程序一样就直接写了,结果一直出不来,查了一些资料才知道

    微信的是:iconPath(点击之前的图标样式)、iconPath(点击之后的图标样式)
    钉钉的是:icon(点击之前的图标样式)、activeIcon(点击之后的图标样式)

    小程序自带的头部显示、隐藏:

    微信小程序和钉钉小程序——————显示隐藏区别:
    微信小程序:

    "window":{
    	 "navigationStyle": "custom",
    }
    

    钉钉小程序:

    "window": {
        "transparentTitle":"always"
      },
    

    小程序中的for循环:

    钉钉小程序和微信小程序区别:
    钉钉小程序:

    //axml中:
     <view a:for="{{buttonList}}">
            {{item}}
        </view>
    //js中:
    page({
    data: {
        buttonList: ["登录", "注册"]
      },
    })
    

    微信小程序:

    //wxml中:
      <view wx:for="{{nav}}" wx:key="index" class="nav">
            <view>
              <text>{{item}}</text>
            </view>
          </view>
    //js中:
    page({
    	nav: ["1","2"],
    })
    

    跳转页面携带参数:

    并非只有跳转详情页可以携带:
    钉钉小程序:

    DJ(){
    	dd.navigateTo({ url: "/pages/denglu/denglu?password=" + this.data.password })  //这个参数是data中的
    	//参数可以是data里面的,也可以是这个点击事件获取到的
    }
    

    钉钉小程序中使用echart:

    踩坑无数。
    去看看大佬的博客吧:

    传送门:

    钉钉小程序页面顶部的穿透点击

    一般原生钉钉小程序尽量少在头部进行操作,除非不得已,
    其实挺简单只需在json文件中加一个事件穿透:
    上代码:

    {
    "transparentTitle": "always",      //隐藏头部
    "titlePenetrate": "YES"     //事件穿透
    }
    

    钉钉小程序中点击按钮变色,可同时点击多个

    效果图:
    在这里插入图片描述
    直接上代码:(css样式请自动手写)

    
    //axml中
    <view class="cen_box">
                <view class="cen_text">资产分类</view>
                <text a:for="{{plist}}" checked="{{item.selected}}" a:key="{{item.id}}" class="{{item.selected?'cen_vi':'cen_view'}}" data-index="{{index}}" onTap="xzDJ">
                  {{item.name}}
                </text>
              </view>
    
    
    //js中
    
    data:{
    	 plist: [
          { name: "全部", selected: false },
          { name: "无形资产", selected: false },
          { name: "房屋建筑", selected: false },
          { name: "机械设备", selected: false },
          { name: "电子设备", selected: false },
          { name: "备品", selected: false },
        ],
    }
    //数组中每个选项都有一个属性selected:false点击获取元素的索引从而更改数组中对应的索引的selected为true反之为false
     xzDJ(e) {
        let string = "plist[" + e.target.dataset.index + "].selected"
        this.setData({
          [string]: !this.data.plist[e.target.dataset.index].selected
        })
      },
    
    展开全文
  • 低版本android他不支持woff2格式的字体,必须要使用woff格式字体,由于从默认iconfont网站上下载来的字体,woff2排在woff之前,所以导致android无法正确识别...1、把原始下载下来的woff2,替换成钉钉之支持的格式 2、首先找
  • 钉钉小程序时间选择器

    千次阅读 2020-11-30 11:22:32
    钉钉小程序时间选择器前言一、引入ColorUI二、使用步骤1.页面2.逻辑3.工具类(WebUtil)参考 前言 提示:找了一圈没找到钉钉相关的组件,结合ColorUI实现了一个。效果如下。 一、引入ColorUI ColorUI是一个小程序...
  • uniapp关于支付宝小程序或钉钉小程序标题栏自定义 支付宝小程序页面标题默认居左,若想居中需要自定义标题栏 思路:取消已有默认标题设置,自定义标题栏 微信小程序取消默认标题栏命令为再style中定义...
  • 钉钉小程序上传预览下载word,pdf文档等一系列问题 小程序”用完即走“的理念使得有着很好的发展市场,不仅微信小程序,支付宝,钉钉小程序等都受用户的喜爱。 刚接触了一个企业内部应用的钉钉小程序,又一个上传...
  • 网上没有很多适用于钉钉小程序的ui组件库,能找到的可以用的大概是dingui-mini,但是没有说明文档,需要自己看源码 如果使用的是双屏,将开发工具放到副屏上后,切换回单屏,会显示不出开发工具,最好只放在主屏。...
  • 钉钉小程序图表刷新 antv-f2

    千次阅读 2020-01-04 15:22:46
    钉钉小程序图表刷新 antv-f2钉钉小程序引入F2一个页面多个图表图表数据自动刷新 公司有项目拟在钉钉小程序中实现部分功能,其中需要图表展示,经过与echart的比较,最终选择了阿里系的 F2,f2宣传的是“专注于移动,...
  • 小程序各种前端dome

    2018-11-19 17:24:29
    小程序各种前端dome,如:轮播,加载动画,例如h5上的抽屉式效果
  • 页面效果图 待办按钮显示已提交表单,已办按钮显示审批通过表单 ...切换时会默认切换到全部并且下方列表会滚动到顶部 ... 可以上下滚动,for循环渲染数据 组件 ...tabs class="mytab" tabs="{{tabs}}" tabsName="activeTab...
  • 导语:更新my-f2图表数据可以使用chart.changeData(data)。首先定义一个全局变量存储chart实例,这样就可以在onInitChart(F2, config)函数外部调用my-f2的chart实例方法。 已折线图为例,具体实现如下: ...
  • time.axml <view class="page-section" a:if="{{prickShow}}"> <view class="page-section-demo"> <picker-view value="{{value}}" onChange="onChange" class="my-picker">...
  • 钉钉小程序所有问题的解决方案

    万次阅读 多人点赞 2018-10-31 14:53:45
    自从我写了这篇文章,用了这个标题,搜任何钉钉小程序XX问题,我这篇都是第一篇推荐,官方能不能重视一下自己的形象,打着阿里的旗号,做着外包的服务,抄个微信小程序抄成这个diao样,无fuck说! 一个项目做下来,...
  • 钉钉小程序开发注意事项

    千次阅读 2019-09-09 16:05:17
    在dd.httpRequest({})中无法获取this对象,需要在请求外面定义变量去过渡钉钉变量 this.setData({ 'array[0]': 1, 'obj.x':2, }); 2.dataset在组件中可以定义数据,这些数据将会通过事件传递给逻辑层。 ...
  • 最近接到一个工作任务,是把钉钉小程序转微信小程序... 对,居然还有这种操作,之前只听过微信小程序转支付宝小程序的,钉钉转微信是什么鬼???? 实际操作之后发现,并不是太复杂。nodeJS加vscode全局替换,很快就...
  • 3.在小程序跟目录下新建iconfont.acss,将复制代码粘贴进去 4.在app.js中导入iconfont.acss @import "./iconfont.acss"; 5.最后就可以在页面中使用图标了 <view class="iconfont icon-zh...
  • 记录一下第一次使用时碰到的问题。... 开发钉钉小程序。一系列准备工作之后,就进入正题。 直接看文档中云函数的部分 首先是 “使用云函数”: 在小程序云控制台的云函数里创建了云函数之后, ...
  • 最近做钉钉小程序,需要用图表,上网找了一圈,推荐用阿里的antv-f2。 我用的是原生的开发工具,我通过命令npm install @antv/my-f2安装好了,然后根据官网文档写好了,编译的时候提示找不到包。 解决办法如下: 把...
  • 小程序引入字体图标

    2021-03-21 20:03:34
    下载字体图标 创建一个子体文件 把字体图标改成 wxss 不然小程序 会找不到这个文件 在app.wxss 引入 注意点: iconfont.css 改成 wxcss 引入是 @import
  • 钉钉小程序的基础一

    2021-08-29 16:46:28
    一个小程序就是一个全局的app函数,函数在初始化时加载各个页面page,页面加载各个组件component。 小程序分为app和page两层。 一、App() 全局函数 管理所有页面和全局数据,以及提供生命周期回调函数。是一个构造...
  • 不要把icon写在text里面 不然小程序显示不了, H5可以显示
  • 钉钉小程序卡片,应用与平台的深度集成 1案例:幸福大巴一键抢座 大家如果之前使用过幸福大巴抢座功能,可能还记得被连接vpn以及各种来回跳转H5所支配的恐惧。 抢座流程对比: 以前H5页面的抢座流程 ...
  • 钉钉e应用使用阿里字体图标方法

    千次阅读 2018-12-20 13:49:17
    1.复制代码并且下载至本地 2.打开下载的压缩包中的iconfont.css文件,复制代码 3.e应用中新建iconfont.accs文件,将代码复制到文件内 4.在app.acss中引入iconfont.acss文件 @import "./iconfont.acss"...
  • 支付宝小程序使用antv/f2图表 制作圆环进度条 动态参数 ** 相关文档: https://github.com/antvis/my-f2 https://www.yuque.com/antv/f2 https://f2.antv.vision/zh/examples/pie/donut#progress-bar 1. 安装...
  • 最近升级到钉钉4.2后,发现左侧菜单栏的图标全部消失了,点击开的对话框也没有图标了,必须鼠标移动上去,才能显示文字。给使用造成了了很大困扰。 回退老版本也没有解决,重装也没有解决,彻底把钉钉删除干净,再...
  • 2、在小程序里建相应的文件,比如新建lib文件夹,将阿里下载的iconfont.css copy到该文件夹下,并改后缀为.wxss,即iconfont.wxss。 3、@font-face src转成base64,进入https://transfonter.org/链接,将阿里下载的...
  • 钉钉应用云开发实战营第4课,老师讲述的主要内容,除了搭建企业审批工作流,还有一个就是开发一个钉钉小程序。昨晚因为JAVA开发环境的原因,没有继续进行本地钉钉小程序实验,只做了企业审批工作流。今天上午,安装...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 790
精华内容 316
关键字:

钉钉小程序图表