全局引用: 一.安装 Element UI npm i element-ui -S 二.在main.js 中引入 element UI import ElementUI from 'element-ui'    import 'element-ui/lib/theme-chalk/index.css'   //引用 element-ui 样式 Vue.use(ElementUI )  //最后要use ElementUI ,不然会报错 (引入成功,最后就可以在各组件页面中使用了) 按需引用: 一

阿里图标官网:http://www.iconfont.cn 使用阿里云图标大致的方法就是:选中你的图标——保存至你的项目——下载你的图标项目——在项目中引用字体文件. 具体方法可以参考:引用阿里云矢量图标库. 我们今天重点是讲如何在微信小程序中引用阿里云图标库. 我们就从你已经下载好了图标库说起了. 1.把该字体文件及css文件放入到小程序项目中,文件目录如下图: 2.在app.wxss里面引入iconfont.wxss 3.通过icon引用 具体代码如下: <icon class="ta

最近在写微信小程序,但是引用图片,导致项目文件太大,所以就想到引用阿里巴巴矢量图标的方法 第一步:下载阿里巴巴矢量图代码: 第二步:将下载下来的文件中iconfont.ttf转换即可.转换地址:https://transfonter.org/ 转换之后会生成三个文件: 第三步:将stylesheet.css中的全部代码(@font-face)以及之前下载iconfont文件中除了@font-face 以外的代码全部复制到小程序项目中新建的.wxss文件中: 第四步:在所需要的.wxss文件中通过

微信小程序中,在微信官方开发文档我们可以知道 小程序的目录结构 . 一个小程序页面由四个文件组成,一个小程序页面的四个文件具有相同路径与文件名,由此我们可知一个小程序页面对应着一个跟页面同名的js文件.可是当有些公共方法,我们想抽离出来成为一个独立公共的js文件.我们该如何实现呢. 在根目录下有一个app.js文件.这个根目录的js 文件我们可以通过getApp()轻松调用. //app.js App({ globaData:'huangenai' }) //test.js var app =

https://blog.csdn.net/smartsmile2012/article/details/83414642 ================小程序引用外部js====================== //封装的函数function GetUserInfo2018() { console.log("获取用户信息8888")} function count(str) { console.log(str)} //转化成小程序模板语言 这一步非常重要 不然无法正确调用mod

1)首先,登录阿里巴巴iconfont.cn 2)新建项目 3)点击icon收藏 4)加入到test项目中   5)下载到本地解压   6)生成代码   7)复制iconfont.css到xxx.wxss 8)替换iconfont.css中的@font-face为上面的生成代码 9)xxx.wxss样式中@import使用 @import "../../../css/test.wxss"; 10)wxml中使用 <text class='iconfont icon-home' s

1.先建立一个common.js, 写我们的外部js 比如: common.js function getTime(){ //下面写我们的代码 .... } function getCity(){ //下面写我们的代码 .... } module.exports = { //必须在这里暴露接口,以便被外界访问,不然就不能访问 getTime: getTime, getCity:getCity } 2.在需要引入js文件的js中写 var commonJS= require("common.js&

1.小程序不提供获取dom的操作,而是让我们直接将事件绑定写入到组件内.区别在于bind不阻止冒泡,而catch阻止冒泡. <view id="tapTest" bindtap="tapName"> Click me! </view> 2.currentTarget和target两个属性,前者是绑定事件的组件,后者是触发事件的组件源. <view id="tap1" data-hi="绑定组件"

系列文章: 微信小程序 教程之WXSS微信小程序 教程之引用微信小程序 教程之事件微信小程序 教程之模板微信小程序 教程之列表渲染微信小程序 教程之条件渲染微信小程序 教程之数据绑定微信小程序 教程之WXML 引用 WXML提供两种文件引用方式import和include.import import可以在该文件中使用目标文件定义的template,如:在item.wxml中定义了一个叫item的template:<!-- item.wxml --><template name="

如何解决微信小程序界面适配问题 .wxss page{ height: 100%; width:750rpx; } this.setData({ imageWidth: wx.getSystemInfoSync().windowWidth }) rpx(responsive pixe)可以根据屏幕宽度进行自适应 WXML 提供两种文件引用方式import和include. import import可以在该文件中使用目标文件定义的template,如: 在 item.wxml 中定义了一个叫it

今天在做微信小程序时,设置wx.navigateTo页面跳转并传参数,点击始终没有效果,代码如下: //事件处理函数 newsDetail: function (event) { console.log(event), //带id跳转到指定的页面,这里的event.currentTarget.dataset.id是获取wxml页面上的data-id参数,详见事件说明 wx.navigateTo({ url: "../detail/detail?id="+event.currentTar

最近在研究微信小程序,自己写demo的时候想要引用巴里巴巴图标库的图标,于是: @font-face { font-family: 'iconfont'; src: url('iconfont.eot'); src: url('iconfont.eot?#iefix') format('embedded-opentype'), url('iconfont.woff') format('woff'), url('iconfont.ttf') format('truetype'), url('ico

login.wxml <view> <!-- <image src="./88.png"></image> --> # 在当前目录下导入图片 <image src="../../images/00.jpg"></image> # 导入根目录的文件下的图片 <view class="userinfo"> <input type="text"

1.mpvue入门教程, http://mpvue.com/mpvue/quickstart.html # . 先检查下 Node.js 是否安装成功 $ node -v v8.9.0 $ npm -v # . 由于众所周知的原因,可以考虑切换源为 taobao 源 $ npm set registry https://registry.npm.taobao.org/ # . 全局安装 vue-cli # 一般是要 sudo 权限的 $ npm install --global vue-cli@

微信小程序也已出来有一段时间了,最近写了几款微信小程序项目,今天来说说感受. 首先开发一款微信小程序,最主要的就是针对于公司来运营的,因为,在申请appid(微信小程序ID号)时候,需要填写相关的公司认证信息如,营业执照等 再次就是用一个未曾开通过公众号的QQ号或微信号来注册一个微信小程序号. 最后,下载微信小程序开发工具. 由于这里,我们更多的关注如何去开发一些app,而不是科谱微信小程序,故在此不在过多的解释,详细的说明,可以去官网帮助文档. 首先,我们拿自己的项目在一步一步的说明并开发吧,

微信官方已经开放微信小程序的官方文档和开发者工具.前两天都是在看相关的新闻来了解小程序该如何开发,这两天官方的文档出来之后,赶紧翻看了几眼,重点了解了一下文档中框架与组件这两个部分,然后根据简易教程,做了一个常规的todo app.这个app基于微信小程序的平台,实现了todo app的常规功能,同时为了让它更接近实际的工作场景,也用到了loading与toast这两个组件来完成一些操作的交互与反馈.这个平台给我的直观感受是,技术层面,它跟vue有相似性,但是远没有vue强大:开发时候的思路,不

看完微信小程序的前端代码真的让我热血沸腾啊,代码逻辑和设计一目了然,没有多余的东西,真的是大道至简. 废话不多说,直接分析前端代码.个人观点,难免有疏漏,仅供参考. 文件基本结构: 先看入口app.js,app(obj)注册一个小程序.接受一个 object 参数,其指定小程序的生命周期函数等.其他文件可以通过全局方法getApp()获取app实例,进而直接调用它的属性或方法,例如(getApp().globalData) //app.js App({ onLaunch: function ()

本人对知乎日报是情有独钟,看我的博客和github就知道了,写了几个不同技术类型的知乎日报APP要做微信小程序首先要对html,css,js有一定的基础,还有对微信小程序的API也要非常熟悉 我将该教程分为以下三篇 微信小程序开发日记--高仿知乎日报(上) 微信小程序开发日记--高仿知乎日报(中) 微信小程序开发日记--高仿知乎日报(下) 三篇分别讲不同的组件和功能块 这篇要讲 日报详情页 底部工具栏 评论页面 日报详情页 日报的内容也是最难做的,因为接口返回的内容是html-,天呀,是html

ps:微信APP Store.微信小程序.微信应用号都是指同一个事情. 苦逼程序猿刚下班到家,还没来得及洗漱,收到条小道消息的推送.于是我有气无力的拿着手机点开了这条推送消息,映入眼帘的就是这张封面图片. 首先,已经有不少人拿到微信小程序的内测: 很荣幸,劳资连需要啥资格都不太了解. 微信小程序是个什么鬼呢?下面这段引用是从微博抄来的. 什么是小程序:小程序是一种不需要下载安装即可使用的应用,它实现了应用"触手可及"的梦想,用户扫一扫或者搜一下即可打开应用.也体现了"用完即走

微信小程序来了!这个号称干掉传统app的玩意儿虽然目前处于内测阶段,不过目前在应用号的官方文档里已经放出了没有内测号也能使用的模拟器了. 工具和文档可以参考官方文档:https://mp.weixin.qq.com/debug/wxadoc/dev/?t=1477926804193 TypeScript: TypeScript是C#之父Anders Hejlsberg的又一力作,相信喜欢C#语法的朋友们对TypeScript一定也会爱不释手. 简单的聊一聊TypeScript吧 TS是一个应用程

1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=14764346784612:简易教程:https://mp.weixin.qq.com/debug/wxadoc/dev/?t=14764346775993:设计指南:https://mp.weixin.qq.com/debug/wxadoc/design/index.html4:设计资源下载:https://mp.weixin.qq.com/debug/wxadoc/design/#资源下载5