[TOC]
# Component is not found in path "xxxxx"
```js
jsEnginScriptError
Component is not found in path "components/Toast/index" (using by "components/loginModal/index");onAppRoute
Error: Component is not found in path "components/Toast/index" (using by "components/loginModal/index")
```
我們需要知道，
微信的組件**必有組件構造函數：**
```
Component({ })
```
Taro 組件生成的代碼需要如下，才算正常：
```
Component(require('../../npm/@tarojs/taro-weapp/index.js').default.createComponent(TInfo));
```
# API 兼容性方案
| API | 兼容性 | 說明 |思路 |
| --- | --- |--- |--- |
| `Taro.getApp()` | h5 未實現 API | - | - |
# 樣式兼容
在編譯時，Taro 會幫你對樣式做尺寸轉換操作，但是如果是在 JS 中書寫了行內樣式，那么編譯時就無法做替換了，針對這種情況，Taro 提供了 API `Taro.pxTransform` 來做運行時的尺寸轉換。
~~~jsx
Taro.pxTransform(10) // 小程序：rpx，H5：rem
~~~
建議使用 Taro 時，設計稿以 iPhone 6 `750px` 作為設計尺寸標準。
[設計稿及尺寸單位](https://nervjs.github.io/taro/docs/size.html#文件)
## class 樣式轉換
[支持替換 jsx 中的屬性](https://github.com/NervJS/taro/issues/2077)
~~~
jsxAttributeNameReplace: {
customClass: 'custom-class',
customTitleClass: 'custom-title-class',
}
~~~
[https://nervjs.github.io/taro/docs/size.html](https://nervjs.github.io/taro/docs/size.html)
## 事件觸發
### 屬性名必須以 `on` 開頭
props 傳函數，在小程序中是通過*組件事件*來實現的，在子組件中調用時無法獲取到函數執行的返回值，同時給子組件傳遞函數時，屬性名必須以`on`開頭
```
// 外部的組件上的`onChange`事件，會被編譯成 `bindonchange`
this.$scope.triggerEvent('onchange', { index: index });
```
解決辦法：
自定義父組件（`\src\common\component.js`）,所有自定義子組件都必須繼承該組件。
### 必須明確的使用 `stopPropagation`
在 Taro 中另一個不同是你不能使用`catchEvent`的方式阻止事件冒泡。你必須明確的使用`stopPropagation`。例如，阻止事件冒泡你可以這樣寫：
```jsx
class Toggle extends Component {
constructor (props) {
super(props)
this.state = {isToggleOn: true}
}
onClick = (e) => {
e.stopPropagation()
this.setState(prevState => ({
isToggleOn: !prevState.isToggleOn
}))
}
render () {
return (
<button onClick={this.onClick}>
{this.state.isToggleOn ? 'ON' : 'OFF'}
</button>
)
}
}
```
## 組件關系 relations
當兩個自定義組件之間有著**嵌套關系**的時候，可以在兩個組件之內定義[relations](https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/relations.html)，從而直接訪問對方組件的實例。**必須在兩個組件中都定義 relations，否則不會生效**
## 自定義組件的 behaviors？
[【bug】定義了behaviors，但是沒有執行呢](https://github.com/NervJS/taro/issues/656)
beta.8 版本組件已支持 behaviors 配置：`static behaviors = []`
`注意`：也就是只能按照 小程序本身設置 `behaviors` 方式設置，不支持 `Taro` 生命周期。
```js
function bindBehaviors (weappComponentConf, ComponentClass) {
if (ComponentClass.behaviors) {
weappComponentConf.behaviors = ComponentClass.behaviors
}
}
// 代碼出處為：`taro/packages/taro-weapp/src/create-component.js`
```
1. 不支持 relations 和 [Behavior ](https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/behaviors.html)
[Taro 不支持 relations 和 Behavior ](https://nervjs.github.io/taro/docs/taroize.html#%E4%B8%8D%E6%94%AF%E6%8C%81-relations-%E5%92%8C-behavior)
[微信小程序 發現之旅（三）—— 組件之間的參數傳遞](https://www.cnblogs.com/wisewrong/p/9110687.html)
2. [試用React語法的多端框架Taro問題匯總](https://juejin.im/post/5b8ca6236fb9a01a1b20162e)
