重复代码太多，怎么能简化一下，定义加载详情页导航和banner，并判断banner图数量显示。

function open_detail(item) {
var p1=item.picture1;
p2=item.picture2;
p3=item.picture3;
p4=item.picture4;
p5=item.picture5;
p6=item.picture6;
str="https://www.yysz123.comnull";
if (p1!=str&&p2!=str&&p3!=str&&p4!=str&&p5!=str&&p6!=str) {
var options = {
styles: {
"popGesture": "close",
"render": "always",
"popGesture": "hide",
"bounce": "vertical",
"bounceBackground": "#efeff4",
"titleNView": { //详情页原生导航配置
backgroundColor: '#f7f7f7', //导航栏背景色
titleText: item.name, //导航栏标题
titleColor: '#000000', //文字颜色
type: 'transparent', //透明渐变样式
autoBackButton: true, //自动绘制返回箭头
splitLine: { //底部分割线
color: '#cccccc'
}
},
"subNViews": [{ //配置图片轮播
id: 'slider-native',
type: 'ImageSlider',
styles: {
// left: '0',
// right: '0',
top: '50px',
height: '200px',
position: 'static',
backgroundColor: '#ffffff',
loop: true,
images: [
{
src: item.picture1,
height: '200px',
}, {
src: item.picture2,
height: '200px',
}, {
src: item.picture3,
height: '200px',
}, {
src: item.picture4,
height: '200px',
}, {
src: item.picture5,
height: '200px',
}, {
src: item.picture6,
height: '200px',
}]
}
}]
},
extras:{
name:item.name,
code:item.code,
price:item.price,
introduce:item.introduce,
properties:item.properties,
}
};
}
else if(p2==str){
var options = {
styles: {
"popGesture": "close",
"render": "always",
"popGesture": "hide",
"bounce": "vertical",
"bounceBackground": "#efeff4",
"titleNView": { //详情页原生导航配置
backgroundColor: '#f7f7f7', //导航栏背景色
titleText: item.name, //导航栏标题
titleColor: '#000000', //文字颜色
type: 'transparent', //透明渐变样式
autoBackButton: true, //自动绘制返回箭头
splitLine: { //底部分割线
color: '#cccccc'
}
},
"subNViews": [{ //配置图片轮播
id: 'slider-native',
type: 'ImageSlider',
styles: {
// left: 0,
// right: 0,
top: '50px',
height: '200px',
position: 'static',
backgroundColor: '#ffffff',
loop: true,
images: [
{
src: item.picture1,
height: '200px',
}]
}
}]
},
extras:{
name:item.name,
code:item.code,
price:item.price,
introduce:item.introduce,
properties:item.properties,
}
};
}
else if(p3==str){
var options = {
styles: {
"popGesture": "close",
"render": "always",
"popGesture": "hide",
"bounce": "vertical",
"bounceBackground": "#efeff4",
"titleNView": { //详情页原生导航配置
backgroundColor: '#f7f7f7', //导航栏背景色
titleText: item.name, //导航栏标题
titleColor: '#000000', //文字颜色
type: 'transparent', //透明渐变样式
autoBackButton: true, //自动绘制返回箭头
splitLine: { //底部分割线
color: '#cccccc'
}
},
"subNViews": [{ //配置图片轮播
id: 'slider-native',
type: 'ImageSlider',
styles: {
// left: 0,
// right: 0,
top: '50px',
height: '200px',
position: 'static',
backgroundColor: '#ffffff',
loop: true,
images: [
{
src: item.picture1,
height: '200px',
}, {
src: item.picture2,
height: '200px',
}]
}
}]
},
extras:{
name:item.name,
code:item.code,
price:item.price,
introduce:item.introduce,
properties:item.properties,
}
};
}
else if(p4==str){
var options = {
styles: {
"popGesture": "close",
"render": "always",
"popGesture": "hide",
"bounce": "vertical",
"bounceBackground": "#efeff4",
"titleNView": { //详情页原生导航配置
backgroundColor: '#f7f7f7', //导航栏背景色
titleText: item.name, //导航栏标题
titleColor: '#000000', //文字颜色
type: 'transparent', //透明渐变样式
autoBackButton: true, //自动绘制返回箭头
splitLine: { //底部分割线
color: '#cccccc'
}
},
"subNViews": [{ //配置图片轮播
id: 'slider-native',
type: 'ImageSlider',
styles: {
left: 0,
right: 0,
top: 0,
height: '200px',
position: 'static',
backgroundColor: '#ffffff',
loop: true,
images: [
{
src: item.picture1,
height: '200px',
}, {
src: item.picture2,
height: '200px',
}, {
src: item.picture3,
height: '200px',
}]
}
}]
},
extras:{
name:item.name,
code:item.code,
price:item.price,
introduce:item.introduce,
properties:item.properties,
}
};
}
else if(p5==str){
var options = {
styles: {
"popGesture": "close",
"render": "always",
"popGesture": "hide",
"bounce": "vertical",
"bounceBackground": "#efeff4",
"titleNView": { //详情页原生导航配置
backgroundColor: '#f7f7f7', //导航栏背景色
titleText: item.name, //导航栏标题
titleColor: '#000000', //文字颜色
type: 'transparent', //透明渐变样式
autoBackButton: true, //自动绘制返回箭头
splitLine: { //底部分割线
color: '#cccccc'
}
},
"subNViews": [{ //配置图片轮播
id: 'slider-native',
type: 'ImageSlider',
styles: {
left: 0,
right: 0,
top: 0,
height: '200px',
position: 'static',
backgroundColor: '#ffffff',
loop: true,
images: [
{
src: item.picture1,
height: '200px',
}, {
src: item.picture2,
height: '200px',
}, {
src: item.picture3,
height: '200px',
}, {
src: item.picture4,
height: '200px',
}]
}
}]
},
extras:{
name:item.name,
code:item.code,
price:item.price,
introduce:item.introduce,
properties:item.properties,
}
};
}
else if(p6==str){
var options = {
styles: {
"subNViews": [{ //配置图片轮播
id: 'slider-native',
type: 'ImageSlider',
styles: {
left: 0,
right: 0,
top: 0,
height: '200px',
position: 'static',
backgroundColor: '#ffffff',
loop: true,
images: [
{
src: item.picture1,
height: '200px',
}, {
src: item.picture2,
height: '200px',
}, {
src: item.picture3,
height: '200px',
}, {
src: item.picture4,
height: '200px',
},{
src: item.picture5,
height: '200px',
}]
}
}]
},
extras:{
name:item.name,
code:item.code,
price:item.price,
introduce:item.introduce,
properties:item.properties,
}
};
}
mui.openWindow("../pages/product_detail.html", '56', options);
}

常规处理是：

针对options，创建一个方法getOptions(type)，参数type表示哪个类型，options的变化部分根据传入的type相应的赋值
subNViews类似处理

但是对于vue来说，更简单了，你可以使用computed对属性进行计算
https://blog.csdn.net/ligang2585116/article/details/94590314

把options相同的提取出来，不同的可以进行追加
https://blog.csdn.net/lucky123star/article/details/76473931

看注释

function open_detail(item) {
  // 获取字段数
  const len = Object.values(item).length
  let images = []
  for (let i = 0; i < len; i++) {
    // 拼接 picture1 picture2 picture3 pictureN 字段
    const field = `picture${i + 1}`
    if (field in item && item[field] !== 'https://www.yysz123.comnull') {
      images.push({
        src: item[field],
        height: '200px'
      })
    }
  }
  const options = {
    styles: {
      render: 'always',
      popGesture: 'hide',
      bounce: 'vertical',
      bounceBackground: '#efeff4',
      titleNView: {
        // 详情页原生导航配置
        backgroundColor: '#f7f7f7', // 导航栏背景色
        titleText: item.name, // 导航栏标题
        titleColor: '#000000', // 文字颜色
        type: 'transparent', // 透明渐变样式
        autoBackButton: true, // 自动绘制返回箭头
        splitLine: {
          // 底部分割线
          color: '#cccccc'
        }
      },
      subNViews: [
        {
          // 配置图片轮播
          id: 'slider-native',
          type: 'ImageSlider',
          styles: {
            top: '50px',
            height: '200px',
            position: 'static',
            backgroundColor: '#ffffff',
            loop: true,
            images: images
          }
        }
      ]
    },
    extras: {
      name: item.name,
      code: item.code,
      price: item.price,
      introduce: item.introduce,
      properties: item.properties
    }
  }
  mui.openWindow('../pages/product_detail.html', '56', options)
}