小编Ben*_*Max的帖子

我真的很困惑:

1. export const foo
2. export default foo
3. module.exports = foo;

我知道这些是非常基本的,但有人可以区分并向我解释这些.我真的很想了解.

我在项目中使用react-swipeable-views来启用触摸滑动事件.我可以在不同div的内部之间滑动<SwipeableViews/>.我有三个不同的div,其中,在第一个div中,我有图像列表.在剩下的两个div中,什么也没有.

export default class Photos extends React.Component {
    render() {
        const styles = {
          slide: {
            padding: '15px',
            minHeight: '500px',
            color: '#fff',
          },
          slide1: {
            background: '#FEA900',
            overflowY: 'hidden'
          },
          slide2: {
            background: '#B3DC4A',
          },
          slide3: {
            background: '#6AC0FF',
          }
        }

        return(
            <div id="profile_photos">

               <div id="profile_photos_nav">
                   <span class="photo_nav" id="photo_timeline">
                       <button class="active_btn">Timeline Photos</button>
                    </span>
                   <span class="photo_nav" id="photo_profile">
                       <button>Profile Photos</button>
                   </span>
                   <span class="clear_both"></span>
               </div>

               <SwipeableViews>
                    <div style={Object.assign({}, styles.slide, styles.slide1)}>
                        <img src="img/img3.jpg"/>
                        <img src="img/img5.jpg"/>
                        <img src="img/img6.jpg"/>
                        <img …

我想在输入中显示输入的标签,这样当我单击输入时,标签将动画并转到输入上方并更改输入边框的样式.

像这样:

* {
  margin: 0;
  padding: 0;
}

form {
  width: 100%;
  max-width: 500px;
  margin: 0 auto;
  outline: 1px solid lightgrey;
  padding: 10px;
}

label, input[type='text'], input[type='password'] {
  font-size: 12pt;
  padding: 8px;
}

label {
  color: grey;
}

input {
  border: none;
  outline: none;
  border-bottom: 1px solid grey;
}

<form>
  <label for="username">Username</label>
  <input id="username" name="username" type="text"/>
  <br/>

  <label for="password">Password</label>
  <input id="password" name="password" type="password"/>
  <br/>

  <input type="submit" value"login"/>
</form>

我怎样才能用CSS实现这个目标？

首先,请让我明白我是一个Windows用户,对网络世界来说是一个新手.在过去的几个月里,我一直在学习python和django,对我来说这是一次很棒的经历.现在我以某种方式创建了一个我希望在生产服务器中部署的小项目.由于django有内置的开发服务器,所以对我没有问题.但现在我必须将它部署到生产服务器上,我用Google搜索并发现Nginx + uWSGI或Nginx + Gunicorn是它的最佳选择.由于uWSGI和Gunicord与Windows不兼容,我认为我应该适应Ubuntu或其他Unix系统.

所以我的问题是:

1. 为了清楚起见,因为我将不得不使用上述其中一个,请向我解释为什么我需要两台服务器？
2. 如果我必须适应Ubuntu环境,我是否必须学习Ubuntu shell脚本,SSH和其他东西？或托管服务提供商会帮助我做到这一点？
3. 请让我知道上述有关我还需要什么.

非常感谢你的时间,如果我的问题是一个蹩脚的问题,请原谅.希望得到积极回应的答案.

请考虑以下三种型号:

class Movie(models.Model):
    name = models.CharField(max_length=254, unique=True)
    language = models.CharField(max_length=14)
    synopsis = models.TextField()

class TimeTable(models.Model):
    date = models.DateField()

class Show(models.Model):
    day = models.ForeignKey(TimeTable)
    time = models.TimeField(choices=CHOICE_TIME)
    movie = models.ForeignKey(Movie)

    class Meta:
        unique_together = ('day', 'time')

每个人都有他们的序列化器:

class MovieSerializer(serializers.HyperlinkedModelSerializer):
    movie_id = serializers.IntegerField(read_only=True, source="id")

    class Meta:
        model = Movie
        fields = '__all__'    

class TimeTableSerializer(serializers.HyperlinkedModelSerializer):
    class Meta:
        model = TimeTable
        fields = '__all__'


class ShowSerializer(serializers.HyperlinkedModelSerializer):
    class Meta:
        model = Show
        fields = '__all__'

和他们的路由器

router.register(r'movie-list', views.MovieViewSet)
router.register(r'time-table', views.TimeTableViewSet)
router.register(r'show-list', views.ShowViewSet)        

现在我想通过过滤特定电影对象的所有Show对象来获取所有TimeTable对象(即日期列表).这段代码似乎是工作和获取列表,就像我想要的那样

m = …

我有自己的自定义用户模型,也有自己的Manger.

楷模:

class MyUser(AbstractBaseUser, PermissionsMixin):
    email = models.EmailField(max_length=255, unique=True)
    first_name = models.CharField(max_length=35)
    last_name = models.CharField(max_length=35)
    username = models.CharField(max_length=70, unique=True)
    date_of_birth = models.DateField()
    is_active = models.BooleanField(default=True)
    is_admin = models.BooleanField(default=False)

    @property
    def is_staff(self):
        return self.is_admin

    def get_full_name(self):
        return ('%s %s') % (self.first_name, self.last_name)

    def get_short_name(self):
        return self.username

    objects = MyUserManager()
    USERNAME_FIELD = 'email'
    REQUIRED_FIELDS = ['first_name', 'last_name', 'username', 'date_of_birth']

经理:

class MyUserManager(BaseUserManager):
    def create_user(self, email, first_name, last_name, username, date_of_birth, password=None, **kwargs):
        if not email:
            raise ValueError('User must have an email address')

        user …

在我从组件的脚本中获取电影细节之前.该功能首先检查商店的电影ID是否与路线的参数电影ID相同.如果相同则不从服务器API获取电影,否则从服务器API获取电影.

它工作正常.但现在我正试图从商店的变异中获取电影细节.但是我收到了错误

未捕获的TypeError:无法读取未定义的属性'$ route'

如何使用vue-router ($route)访问params和vue-resource ($http)以从vuex存储中的服务器API获取？

store.js:

export default new Vuex.Store({
    state: {
        movieDetail: {},
    },
    mutations: {
        checkMovieStore(state) {
            const routerMovieId = this.$route.params.movieId;
            const storeMovieId = state.movieDetail.movie_id;
            if (routerMovieId != storeMovieId) {
                let url = "http://dev.site.com/api/movies/movie-list/" + routerMovieId + "/";
                this.$http.get(url)
                    .then((response) => {
                        state.movieDetail = response.data;
                    })
                    .catch((response) => {
                        console.log(response)
                    });
            }
        },
    },
});

组件脚本:

export default {
    computed: {
        movie() {
            return this.$store.state.movieDetail;
        }
    },
    created: function () {
        this.$store.commit('checkMovieStore');
    },
}

我使用django作为后端,并为应用程序做出反应原生.当应用程序在react-native app中打开时componentDidMount(),该方法将通过url请求django服务器:

export default class App extends React.Component {
    constructor(props) {
        super(props)
    }
    componentDidMount() {
        this.fromServer()
    }
    fromServer() {
        var headers = new Headers();
        headers.append('Accept', 'application/json');
        let a = fetch('http://xxx.xxx.xx.xx:8080/posts/', headers)
            .then(function(response) {
                console.log('fetched...')
                    if (response.status !== 200) {
                        console.log('There was a problem. Status Code: ' +  response.status);  
                        return;
                    }
                    response.json().then(function(data) {  
                        console.log(data);
                    });  
                }  
            )  
            .catch(function(err) {  
                console.log('Fetch Error :-S', err);  
            });
    }
    render() {
        return (
            <View>
                <ListView dataSource=?????></ListView>
            </View>
        );
   }
}

服务器将响应一组json对象.像这样:

[
    { …

我有一个使用Nuxtjs创建的Vuejs应用程序.我也使用Django作为后端服务器,我创建了一个API来与后端服务器(Django)和前端应用程序(Vuejs/Nuxtjs)进行交互.并且任何与API相关的提取都在页面中完成,以使用axios在服务器端呈现数据.此外,我正在使用json Web令牌身份验证,并且API在成功登录后生成一个jwt令牌,该令牌存储在cookie中.因此,在后端,它将始终检查令牌的请求的授权标头.如果请求来自登录用户(授权令牌),则返回经过身份验证的json数据,否则返回未经过身份验证的数据.AsyncData function

问题:

当用户导航到应用程序时,我想检查用户是否经过身份验证.如果用户已通过身份验证,请呈现经过身份验证的页面.如果没有则显示未经过身份验证的页面.

我的想法:

当从app上完成提取时AsyncData function,我会检查cookie是否有任何值.如果有,则发送带有请求的授权标头的令牌.但是,由于页面将首先在服务器上呈现,而不是在客户端(cookie实际上在哪里)呈现,因此它永远不会找到授权令牌.

如何检查用户是否已登录,以便我可以分别从API获取经过身份验证和未经过身份验证的数据？

更新

当我登录成功(后授权的电子邮件和密码),我得到的令牌,我在这样的cookie中设置一个JSON响应回:

this.$cookie.set('my_auth_token', this.token, {expires: 15})

如何检索客户端cookie并进入服务器端渲染的nuxt服务器？

我正在尝试制作酒店预订应用程序。所以我有两个模型，即房间和预订。

# models
class Room(models.Model):
    name = models.CharField(max_length=50)

class Booking(models.Model):
    room = models.ForeignKey(Room, on_delete=models.CASCADE)
    booked_for_datetime = models.DateTimeField()
    booked_till_datetime = models.DateTimeField()

当所需房间已经有另一个预订时，我想通知房间是否不可用，或者如果它确实可用，则创建一个预订。

我正在使用 django rest 框架，所以我必须在 create 和 update 方法上应用这些验证，可能是这样的：

# serializers

def roomAvailable(validated_data):
    available = False

    # ...
    # validation check here...
    # ...

    return available


class BookingSerializer(serializers.ModelSerializer):
    class Meta:
        model = Booking
        fields = '__all__'

    def create(self, validated_data):
        if roomAvailable(validated_data):
            return Booking.objects.create(**validated_data)
        else:
            raise serializers.ValidationError({
                "detail": "Room is not available for these dates."
            })

    def update(self, instance, validated_data):
        if …