React Native组件别名导入异常：组件为undefined无法使用

当然可以给React Native组件设置别名导入，你的问题出在导出和导入方式不匹配：

问题原因 #

你的view/ClientPricelist.js用的是export default导出组件，但在controller/ClientPricelist.js里用了命名导入语法（带花括号的{ClientPricelist as ClientPricelistView}），这两种方式不兼容，导致你拿到的是undefined。

两种解决方法 #

方法1：针对默认导出直接设置别名

默认导出的组件，导入时可以直接自定义名称（这就是别名），不需要花括号：

// controller/ClientPricelist.js
import ClientPricelistView from '../view/ClientPricelist';

export default function Index(){
    console.log(<ClientPricelistView/>);
    return <ClientPricelistView/>;
}

方法2：改用命名导出+别名导入

如果想保留花括号的别名语法，需要修改视图文件的导出方式为命名导出：

// view/ClientPricelist.js
export function ClientPricelist({navigation, route, order_product, product_select}) { return null; }

然后导入时就可以正常使用别名：

// controller/ClientPricelist.js
import {ClientPricelist as ClientPricelistView} from '../view/ClientPricelist';

export default function Index(){
    console.log(<ClientPricelistView/>);
    return <ClientPricelistView/>;
}

内容的提问来源于stack exchange，提问作者user2573099