现在测试一下ant-design-mobile的使用,引用一个Button

没有样式

这个问题是没有引入样式

解决方法有两种

这种方法自己弄不出来,然后用另外一种方法

引入样式:

import 'antd-mobile/dist/antd-mobile.css';

然后就解决了。

另外补充点东西,根据ant-design-mobile文档的说明,项目的入口页面还需要配置点东西,预防出现的bug

<!DOCTYPE html>
<html>
<head>
<!-- set `maximum-scale` for some compatibility issues -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
<script src="https://as.alipayobjects.com/g/component/fastclick/1.0.6/fastclick.js"></script>
<script>
if ('addEventListener' in document) {
document.addEventListener('DOMContentLoaded', function() {
FastClick.attach(document.body);
}, false);
}
if(!window.Promise) {
document.writeln('<script src="https://as.alipayobjects.com/g/component/es6-promise/3.2.2/es6-promise.min.js"'+'>'+'<'+'/'+'script>');
}
</script>
</head>
<body></body>
</html>

react项目的ant-design-mobile的使用的更多相关文章

  1. React实战之Ant Design—Upload上传_附件上传

    React实战之Ant Design—Upload上传_附件上传 Upload组件大家都在官方文档中看过了,但写的时候还是会遇到许多问题,一些新手看了文档后感觉无从下手,本文过多的简绍就不说了,直接看 ...

  2. react 编写 基于ant.design 页面的参考笔记

    前言 因为我没有系统的学习 react,是边写边通过搜索引擎找相对的问题,看 ant.design的 中文文档 编写的一个单页面, 以下的笔记都是写 gksvideourlr 时记录的. 重新设定表单 ...

  3. React组件库Ant Design的安装与使用

    一.什么是 Ant Design 1.Ant Design 提炼自企业级中后台产品的交互语言和视觉风格 2.Ant Design 使用 TypeScript 构建,提供完整的类型定义文件 二.Ant ...

  4. 【零售App】—— react/ant design mobile项目爬坑

    一.H5制作 - 图片文本的动画效果 bug:打开一个模板,添加图片,添加动画效果,若先选定动画效果,再调节动画时间和延迟时间,则动画和延迟时间没有改变:若先调节动画时间和延迟时间在选定动画效果,则动 ...

  5. react项目的react-router-dom路由的使用

    现在测试一下react-router-dom路由的使用,首先在App.js这个文件搭配路由 import React, { Component } from 'react'; import {Link ...

  6. ant Design和ant Design mobile的使用,并实现按需加载

    1.全局安装yarn npm install -g create-react-app yarn 2.创建react项目,并用yarn start 运行 3.引入antd/引入antd-mobile y ...

  7. Ant Design Mobile 使用 rc-form

    引入: import { createForm } from 'rc-form'; 步骤一:绑定 form // 将form表单的api绑定到props,便于调用 const EditHeaderWr ...

  8. 十九、React UI框架Antd(Ant Design)的使用——及react Antd的使用 button组件 Icon组件 Layout组件 DatePicker日期组件

    一.Antd(Ant Design)的使用:引入全部Css样式 1.1 antd官网: https://ant.design/docs/react/introduce-cn 1.2 React中使用A ...

  9. 【React自制全家桶】一、Webstrom+React+Ant Design+echarts搭建react项目

    前言 一.React是Facebook推出的一个前端框架,之前被用于著名的社交媒体Instagram中,后来由于取得了不错的反响,于是Facebook决定将其开源.出身名门的React也不负众望,成功 ...

随机推荐

  1. 通过 JDK 自带的 javap 命令查看 SynchronizedDemo 类的相关字节码信息

    首先切换到类的对应目录执行 javac SynchronizedDemo.java 命令生成编译后的 .class 文件 然后执行 javap -c -s -v -l SynchronizedDemo ...

  2. ubuntu18关闭系统自动更新

    ubuntu18.04关闭系统自动更新有两个方法:1.修改配置文件 修改配置文件/etc/apt/apt.conf.d/10periodic#0是关闭,1是开启,将所有值改为0vi etc/apt/a ...

  3. 18.2 of的函数集中的of是Open Firmware的缩写

    内核中操作dtb的一套函数都是of开头,这个of是open firmware.dts的方法来源于open Firmware On Sun SPARC systems, the Open Firmwar ...

  4. DataTable的详细用法

    在项目中经常用到DataTable,如果DataTable使用得当,不仅能使程序简洁实用,而且能够提高性能,达到事半功倍的效果,现对DataTable的使用技巧进行一下总结. 一.DataTable简 ...

  5. JavaScript开发中使用频率较高的一些方法

    1.填充字符串 ES7推出了字符串补全长度的功能.如果某个字符串不够指定长度,会在头部或尾部补全. String.prototype.padStart(maxLength, fillString=’ ...

  6. mysqlbinlog基于时间点恢复

    基于时间点恢复 /data/mysq/mysqlbin.000026 #mysqlbinlog文件,恢复如下内容: 注意:按照时间点恢复时,可能同一个时间点有其他的操作,要结合上下文的时间选取~ # ...

  7. vue 项目全局修改element-ui的样式

    引入了element-ui,但是和我们自己的样式颜色有很大的不同, 修改例子:在src文件下创建 element-var.scss,代码如下 $--color-primary: yellow;  /* ...

  8. beef + msf 实现内网渗透

    在内网渗透方面,最为大众所知道的就是xp系统的ms08067漏洞,通过这个漏洞可以对未打上补丁的xp系统实现getshell, 但是经过笔者发现,这种漏洞攻击在被攻击机开上windows防火墙的时候是 ...

  9. Nios II Host-Based File System

    Nios II Host-Based File System 允许运行在Nios II的程序,在Debug模式下,通过Altera download cable来读写PC上当前工程目录下(及其子目录) ...

  10. centos密码策略

    centos7密码策略 https://blog.csdn.net/qq_36896749/article/details/80264280 centos7设置密码规则 https://blog.cs ...