ReactNative学习笔记(五)——导出与导入

18人阅读 评论(0) 收藏 举报
分类:

     今天继续跟着视频学习,主要学习了导入与导出,总结如下:

      一,如何导出一个组件,如何使用导出的组件

            在定义组件时,加上export default。例如 export default class HelloComponent extends Component{},或者也可以使用ES5的方式。在定义完组件后,用module.exports = 组件名;例如:module.exports = HelloComponent;来导出组件。

            在其他文件中使用导出的组件时,用import 组件名 from '文件的路径+名称';来导入组件。

            例如 import HelloCompoent from './HelloComponent';

二,如何导出一个变量或常量,如何使用导出的变量和常量

            export let name = ‘孙悟空';    //导出变量name

            let age = 30;            //定义变量age

            const sex = '男';    //定义常量sex

           export{age,sex};        //导出变量age和常量sex,大括号必须加,不然会出错

        在其他文件中使用:

      import{name,age,sex} from'./HelloComponent';   大括号也必须加   

       然后在需要的地方直接使用就可以了。

三,如何导出一个方法,如何使用导出的方法

      export function sum(a,b){        //导出方法sum

            return a+b;

    }

    

  在其他文件中使用:

      import {sum} from'./HelloComponent';   大括号也必须加   

       然后在需要的地方直接使用就可以了。

        导入组件,变量,常量,方法已经介绍完了。

        总体导入的语句是这样的 import HelloComponent ,{ name,age,sex,sum } from'./HelloComponent'; 

        你会发现,为什么HelloComponent不在大括号里呢?写到大括号里会出错吗?name,age等为什么要在大括号里呢?写到大括号外面会出错吗?

        原因是这样的,在导出HelloComponent组件时,使用的是 export default的方法,是默认导出的,所以不用加到大括号里,加进去的会出错的。如果你在导出时,没有使用default,那么它就可以写到括号里了。

       所以,默认导出的就写到括号外面,不是默认导出的就写到括号里面。一个module只能有一个默认导出的值。而且经过我的测试,只有class和function能被默认导出,其他的都会报错。

      参考:

        项目导入与导出


查看评论

为什么jsp不能取代servlet?

JSP动态Web内容可能是动态Web内容的一项伟大的技术,并可将内容和表示presentation相分离,有些人仍然觉得奇怪,为什么servlets仍然有必要和JSP同时实施。其实servlets的实...
  • weqa
  • weqa
  • 2000-09-02 22:40:00
  • 1199

React-Native 组件的导出和导入

在React-Native 中如何自己定义一个组件是一件非常容易的事情。 下面是构建组件的几种方式。 在es6中主要的关键词 export default 进行修饰、之后我们就可以把自定义的组件被...
  • GL_MINE_CSDN
  • GL_MINE_CSDN
  • 2017-05-24 15:21:11
  • 3191

React native (3) 导入和导出

1.组件的导入和导出因为自定义组件有三种方式,所以导出方式也有三种 注意修改新建文件的类名,然后在类名前添加export default ,将他导出 在其他组件中引用,先导入你的自定义组件,然后...
  • sinstar1
  • sinstar1
  • 2017-04-10 11:34:06
  • 806

java 自定义导入xls与导出xls

  • 2012年11月17日 22:55
  • 3KB
  • 下载

cmake 学习笔记(六)

希望这是现阶段阻碍阅读shiboken和PySide源码的涉及cmake的最后一个障碍 ^ _^ 学习 cmake 的单元测试部分 ctest。 简单使用 最简单的使用ctest的方法,就是...
  • dbzhang800
  • dbzhang800
  • 2011-04-22 15:12:00
  • 7037

ReactNative中类的导出与导入

A类导出,B类导入 A类 B类
  • hejiasu
  • hejiasu
  • 2018-01-04 18:39:14
  • 30

Python学习笔记(五)Demos

生成随机串import string,randomfield = string.letters + string.digits def getRandom(): return "".join(...
  • bless2015
  • bless2015
  • 2017-09-01 21:42:12
  • 388

cmake学习笔记(五)

在cmake 学习笔记(三) 中简单学习了 find_package 的 model 模式,在cmake 学习笔记(四)中了解一个CMakeCache相关的东西。但靠这些知识还是不能看懂PySide使...
  • dbzhang800
  • dbzhang800
  • 2011-04-22 12:05:00
  • 8264

React Native 导入独立模块ES6写法 将js文件模块化方式

创建独立的js文件使用export关键字将自定义的组件导出给外部使用,LoginModule 是自定义的导出使用的类名字,extends TextInputDemo,是继承自真实的自定义组件类expo...
  • binglan520
  • binglan520
  • 2017-04-18 15:27:46
  • 1374

Redis系列学习笔记5 集合

集合存储多个各不相同的元素Redis的集合以无序的方式存储多个各不相同的元素。用户可以快速地向集合添加元素,或者从集合里面删除元素,也可以对多个集合进行集合运算操作,比如计算并集、交集和差集。SADD...
  • ECHO_FOLLOW_HEART
  • ECHO_FOLLOW_HEART
  • 2016-05-23 16:04:19
  • 272
    个人资料
    等级:
    访问量: 606
    积分: 156
    排名: 110万+
    文章分类
    文章存档