Question

我要显示从数组中随机选择的对象的图像和相应的文本。

基本上，这就是我计划用来获取名称和图像的链：成分<-IngredientArray <-getRandomIngredient <-getIngredientImage（＆getIngredientName）

我敢肯定，关于面向对象的编程我根本不了解，但是我无法使它正常工作。

ingredientArray：

const ingredient1 = new Ingredient("green salad", require('./app/components/img/base/green_salad.jpg'));
const ingredient2 = new Ingredient("mixed salad", require('./app/components/img/base/mixed_salad.jpg'));
var ingredientArray = ["ingredient1", "ingredient2"]

getRandomIngredient：

function getRandomIngredient (arr){
  if (arr && arr.length) {
    return arr[Math.floor(Math.random() * arr.length)];
  }
}

类成分：

function Ingredient (ingredientName, ingredientImage){
  this.ingredientName = ingredientName;
  this.ingredientImage = ingredientImage;

  Ingredient.prototype.getIngredientName = function(){
    return this.ingredientName;
  }

  Ingredient.prototype.getIngredientImage = function(){
    return this.ingredientImage;
  }
}

我想做什么：

<Image source = {getRandomIngredient(ingredientArray).getIngredientImage()}

但是我收到以下错误消息：

TypeError: getRandomIngredient(...).getIngredientImage is not a function

如果直接调用函数getIngredientImage（），我会得到一个有效的结果：

<Image source = {base1.getIngredientImage()} />

Answer 1

没有getIngredientImage方法，因为getRandomIngredient(ingredientArray)不返回Ingredient的实例。因为ingredientArray是字符串数组，而不是Ingredient实例。

应该是：

var ingredientArray = [ingredient1, ingredient2]

Answer 2

尝试将变量而不是用于常量的“字符串”标识符添加到“ ingredientArray”中。 IE更改

var ingredientArray = ["ingredient1", "ingredient2"]

到

var ingredientArray = [ingredient1, ingredient2]

反应原生TypeError（..）不是函数

2 个答案: